DataGrid顯示為空MVVM Wpf

Question

問題：DataGrid顯示為空，但是我有信息，我的DataGrid收到信息但仍然是空的！

我的XAML：

<DataGrid x:Name="dataGrid" Grid.Row="1" ItemsSource="{Binding ViewList}" 
          CanUserAddRows="False" AlternationCount="2"
          AlternatingRowBackground="Blue">
  <DataGrid.Columns>
    <DataGridTextColumn Header="View" Binding="{Binding id}"
                        Width="2*" IsReadOnly="True" />
    <DataGridTemplateColumn Header="Is Enabled" Width="Auto">
      <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
          <CheckBox IsChecked="{Binding isEnabled, Mode=TwoWay,
                        UpdateSourceTrigger=PropertyChanged}"/>
        </DataTemplate>
      </DataGridTemplateColumn.CellTemplate>
    </DataGridTemplateColumn>                
  </DataGrid.Columns>
</DataGrid>

我的ViewModel：

public ConfigRoleModel()
{
    _viewList = new ObservableCollection<ViewList>(WCFclient.getListOfViews(1));
}

private ObservableCollection<ViewList> _viewList;
public ObservableCollection<ViewList> ViewList
{
    get { return _viewList; }
    set
    {
        _viewList = value;
        OnPropertyChanged("ViewList");
    }
}  

ViewList類：

public class ViewList
{
    public int id;    
    public string description;
    public string code;
}

這是結果：

我該如何解決？

Answer 1

通過查看您的代碼：

1. 您應該在ViewList類中定義公共屬性以使綁定工作。

2. 將Datacontext設置為viewModel。

3. DataContext中沒有isEnabled屬性

您的ViewList類應如下所示：

public class ViewList 
{
    public int Id { get; set; }
    public bool IsEnabled { get; set; }
    ...
}

和你的Xaml：

<DataGrid x:Name="dataGrid" Grid.Row="1"  ItemsSource="{Binding ViewList}" 
           CanUserAddRows="False" AlternationCount="2" AlternatingRowBackground="Blue" >
    <DataGrid.Columns>
        <DataGridTextColumn Header="View" Binding="{Binding Id}" Width="2*" IsReadOnly="True" />

        <DataGridTemplateColumn Header="Is Enabled" Width="Auto">
            <DataGridTemplateColumn.CellTemplate>
                <DataTemplate>
                    <CheckBox IsChecked="{Binding IsEnabled , Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
                </DataTemplate>
            </DataGridTemplateColumn.CellTemplate>
        </DataGridTemplateColumn>                
    </DataGrid.Columns>
</DataGrid>

在您的視圖代碼中或在您的xaml本身中：

• 將DataContext設置為ViewModel

Answer 2

字段不是WPF綁定的有效目標。 您應該使用屬性。

public class ViewList {
    public int Id { get; set; }
    public string Description { get; set; }
    public string Code { get; set; }
    public bool IsEnabled { get; set; }
}

Answer 3

確保View List類實現了INotifyPropertyChanged

public class ViewList : INotifyPropertyChanged
{
    private int _id;
    public int id
    {
        get { return _id; }
        set
        {
            _id = value;
            OnPropertyChanged(new PropertyChangedEventArgs("id"));
        }
    }

    private string _description;
    public string description
    {
        get { return _description; }
        set
        {
            if((value as string) != null)
            {
                _description = value;
                OnPropertyChanged(new PropertyChangedEventArgs("description"));
            }
        }
    }

    private string _code;
    public string code
    {
        get { return _code; }
        set
        {
            _code = value;
            OnPropertyChanged(new PropertyChangedEventArgs("code"));
        }
    }

    private bool _isEnabled;
    public bool isEnabled
    {
        get { return _isEnabled; }
        set
        {
            _isEnabled = value;
            OnPropertyChanged(new PropertyChangedEventArgs("isEnabled"));
        }
    }

    public event PropertyChangedEventHandler PropertyChanged;

    public void OnPropertyChanged(PropertyChangedEventArgs e)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, e);
        }
    }
}

如果您只想顯示ObservableCollection中的數據，則ViewModel不需要實現INotifyPropertyChanged。 這是我的ViewModel：

public class MainWindowVM
{
    private ObservableCollection<ViewList> _MyList;
    public ObservableCollection<ViewList> MyList
    {
        get { return _MyList; }
        set
        {
            if(value != null)
            {
                _MyList = value;
            }
        }
    }

    public MainWindowVM()
    {
        _MyList = new ObservableCollection<WpfDataGridTest.ViewList>();

        _MyList.Add(new WpfDataGridTest.ViewList() { id = 1, code = "C101", description = "test1", isEnabled = true });
        _MyList.Add(new WpfDataGridTest.ViewList() { id = 2, code = "C102", description = "test2", isEnabled = false });
        _MyList.Add(new WpfDataGridTest.ViewList() { id = 3, code = "C103", description = "test3", isEnabled = true });
    }
}

這是我的Window的XAML

<Window x:Class="WpfDataGridTest.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfDataGridTest"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525"
        DataContext="{StaticResource MainWindowVM}">
    <Grid>
        <DataGrid x:Name="dataGrid" HorizontalAlignment="Left" Margin="33,34,0,0" VerticalAlignment="Top" Height="236" Width="444" 
                  CanUserAddRows="False" AlternationCount="2" AlternatingRowBackground="Blue"  AutoGenerateColumns="False" IsSynchronizedWithCurrentItem="True"
                  ItemsSource="{Binding MyList}">
            <DataGrid.Columns>
                <DataGridTextColumn Header="View" Binding="{Binding id}" Width="2*" IsReadOnly="True" />

                <DataGridTemplateColumn Header="Is Enabled" Width="Auto">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate>
                            <CheckBox IsChecked="{Binding isEnabled, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
            </DataGrid.Columns>
        </DataGrid>
    </Grid>

    <TextBox x:Name="textBox" HorizontalAlignment="Left" Height="23" Margin="44,10,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="120"
             Text="{Binding Path=CurrentItem.description, ElementName=dataGrid}"/>
</Window>

這個例子顯示了我使用VS 2015預期的3行。你可以在這里看到：

注意：我將ViewModel的ViewList成員重命名為MyList，因為我不喜歡讓一個成員與一個類的名稱相同，因為它會讓事情變得混亂。