如何将视图模型绑定到视图

Question

我在将我的View Model绑定到我的View时遇到问题。我是MVVM的初学者，但我相信我正在实施我的系统（几乎）。我有一个Model，其中包含的数据是我在View Model中获得的数据，然后当我的页面导航到时，我试图抓取View Model数据并将其绑定到View。

我的问题是，我在我的View中有一个ListBox，每个项目有3个对象，我似乎无法为我的列表中的每个项目正确绑定它。

MainPage.xaml中

<ListBox x:Name="FavoritesListBox" ItemsSource="{Binding FavoriteItems}" 
     SelectionChanged="FavoritesListBox_SelectionChanged"> 

    <StackPanel Orientation="Horizontal" Margin="12,0,12,0"> 
     <Image x:Name="favicon" Source="{Binding Favicon}" 
       Width="50" Height="50"/> 
     <StackPanel> 
      <TextBlock x:Name="favoritesName" Text="{Binding Name}" 
         FontSize="{StaticResource PhoneFontSizeExtraLarge}"/> 
      <TextBlock x:Name="favoritesAddress" 
         Text="{Binding Address}" Margin="12,0,0,0"/> 
     </StackPanel> 
    </StackPanel>     
</ListBox> 

MainPage.xaml.cs中

public FavoritesPage() 
    { 
     InitializeComponent(); 

     // Set the data context of the listbox control to the sample data 
     FavoritesListBox.DataContext = App.ViewModel; 
    } 

App.xaml.cs

private static MainViewModel viewModel = null;   

    public static MainViewModel ViewModel 
    { 
     get 
     { 
      // Delay creation of the view model until necessary 
      if (viewModel == null) 
       viewModel = new MainViewModel(); 

      return viewModel; 
     } 
    } 

个MainViewModel.cs

public ObservableCollection<ItemViewModel> FavoriteItems { get; private set; } 

    public MainViewModel() 
    { 
     //FavoriteItems = new ObservableCollection<ItemViewModel>(); 
     FavoriteItems = Settings.FavoritesList.Value; 
    } 

Settings.cs（模型）

public static Setting<ObservableCollection<ItemViewModel>> FavoritesList = 
    new Setting<ObservableCollection<ItemViewModel>>(
     "Favorites", 
     new ObservableCollection<ItemViewModel>()); 

ItemViewModel.cs

private string _favicon; 
    public string Favicon 
    { 
     get 
     { 
      return _favicon; 
     } 
     set 
     { 
      if (value != _favicon) 
      { 
       _favicon = value; 
       NotifyPropertyChanged("Favicon"); 
      } 
     } 
    } 

    private string _name; 
    public string Name 
    { 
     get 
     { 
      return _name; 
     } 
     set 
     { 
      if (value != _name) 
      { 
       _name = value; 
       NotifyPropertyChanged("Name"); 
      } 
     } 
    } 

    private string _address; 
    public string Address 
    { 
     get 
     { 
      return _address; 
     } 
     set 
     { 
      if (value != _address) 
      { 
       _address = value; 
       NotifyPropertyChanged("Address"); 
      } 
     } 
    } 

    public event PropertyChangedEventHandler PropertyChanged; 
    private void NotifyPropertyChanged(String propertyName) 
    { 
     PropertyChangedEventHandler handler = PropertyChanged; 
     if (null != handler) 
     { 
      handler(this, new PropertyChangedEventArgs(propertyName)); 
     } 
    } 

..和这是在哪里以及如何我保存每个项目（应该有三个属性列在ItemViewModel

void addToFavorites_Click(object sender, EventArgs e) 
{ 
    var favoriteItem = 
     new ItemViewModel{ 
      Favicon = "", 
      Name = "", 
      Address = TheBrowser.currentUrl() }; 
     Settings.FavoritesList.Value.Add(favoriteItem);    
} 

凡FavoritesList是使用ItemViewModel含有3名对象进行填充。该列表正在填充正确，因为在调试期间，我可以看到FavoritesList中的实体，但我有一个问题调用view model中的这些实体出现在我的ListBox的view？

我相信我绑定不正确，但我不知道如何解决这个问题？

Answer 1

在您的XAML中，您绑定了路径Name和Address您是否在您的ItemViewModel中定义了这2个属性？正确读取你的代码后

更新：

你没有更新的列表框中的项目的DataTemplate中。这是你需要做的：

<ListBox x:Name="FavoritesListBox" ItemsSource="{Binding FavoriteItems}" SelectionChanged="FavoritesListBox_SelectionChanged"> 
    <ListBox.ItemTemplate> 
     <DataTemplate> 
      <StackPanel Orientation="Horizontal" Margin="12,0,12,0"> 
       <Image x:Name="favicon" Source="{Binding Favicon}" Width="50" Height="50"/> 
       <StackPanel> 
        <TextBlock x:Name="favoritesName" Text="{Binding Name}" FontSize="{StaticResource PhoneFontSizeExtraLarge}"/> 
        <TextBlock x:Name="favoritesAddress" Text="{Binding Address}" Margin="12,0,0,0"/> 
       </StackPanel> 
      </StackPanel> 
     </DataTemplate> 
    </ListBox.ItemTemplate> 
</ListBox> 

Answer 2

除了你的DataContext设置为你的视图模型，你还需要有您的视图模型实现INotifyPropertyChanged（包括ItemViewModel，你不要在你的问题显示）（在评论链接到Creating ContextBinding XAML提到）