MVVM model binding beginner - wpf

Question

I am new to MVVM and WPF and I am a little bit confused.
Let's say I have 2 models, like this:
public class Category
{
public int Id { get; set; }
public string Name { get; set; }
}
and
public class Product
{
public int Id { get; set; }
public Category Category { get; set; }
public string Name { get; set; }
public decimal Price { get; set; }
}
I am not sure what is the recommended way of implementing the ProducViewModel class for adding a new Product:
Is it OK to just use a public property of type Product and bind it to the view, like this:
public class ProductViewModel : Screen
{
private Product _product;
public BindableCollection<Category> Categories;
public ProductViewModel(Product product, BindableCollection<Category> categories)
{
_product = product;
Categories = categories;
}
public Product Product
{
get { return _product }
set
{
_product = value;
SetAndNotify(ref _product, value);
}
}
}
In this case I will use the Category collection in the form to choose a category.
My view should look something like this:
<StackPanel Orientation="Vertical">
<StackPanel Orientation="Horizontal">
<Label Content="Catgory" />
<ComboBox
ItemsSource="{Binding Categories}"
DisplayMemberPath="Name"
SelectedValue="?????? What comes here? "/>
</StackPanel>
</StackPanel>
Is this correct?
And also, how I will bind Product.Category in a ComboBox in the view?
Thanks!

Answer 1

In your View Model you should expose properties that are needed in your view. This case you can bind directly to your Product.Category or create a new property in your view model, and i think this last option is well suited in a MVVM scenario.
In your case you should create a selected category property your ProductViewModel:
public Category SelectedCategory { get { return _selectedCategory; }
set
{
_selectedCategory = value;
SetAndNotify(ref _selectedCategory, value);
Product.Category = _selectedCategory;
} }
And then in your xaml, you bind combobox's selected value to this new property:
<StackPanel Orientation="Vertical">
<StackPanel Orientation="Horizontal">
<Label Content="Catgory" />
<ComboBox
ItemsSource="{Binding Categories}"
DisplayMemberPath="Name"
SelectedValue="{Binding SelectedCategory}"/>
</StackPanel>