Wpf – MVVM and nested view models

mvvmwpf

I have a simple example where I'm creating a View consisting of a list box, and the list box displays a bunch of items. I'm wondering if I'm going about the creation of the View Model and Model classes correctly here. Use whatever value of correctly works in this context, I understand it's a bit subjective, but my current solution doesn't feel right. Here's a simplified version.

The ViewModels and Models:

namespace Example
{
  public class ParentViewModel
  {
      public ParentViewModel()
      {
          // ... Create/Consume ChildViewModel * n
      }

      public List<ChildViewModel> ChildViewModels { get; set; }
  }

  public class ChildViewModel
  {
      public ChildViewModel()
      {
          // ... Create/Consume ChildModel
      }

      public ChildModel Model { get; set; }
  }

  public class ParentModel
  {
      public List<ChildModel> ChildModels { get; set; }

      public ParentModel()
      {
          // ... Create/Consume ChildModel * n;
      }
  }

  public class ChildModel
  {
      public ChildModel()
      {
          // ... Contains actual data.
      }

      public string Data { get; set; }
  }    
}

The View:

<Window x:Class="Example.View"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:Example="clr-namespace:Example" Title="View" Height="300" Width="300"
    DataContext="{StaticResource TheViewModel}">
    <Window.Resources>
    <Example:ParentViewModel x:Key="TheViewModel" />
</Window.Resources>
<Grid>
    <ListBox Height="261" HorizontalAlignment="Left" Name="listBox1" VerticalAlignment="Top" Width="278" ItemsSource="{Binding ChildViewModels}"/>
</Grid>

In the proper code, the listbox will use a data template to display the child view models. But as you can see I'm not sure how the to instantiate the child related objects. It feels like the ParentViewModel will have a reference to the ParentModel and create ChildViewModel objects based on the ParentModel's ChildModel objects. Now I've said that it doesn't sound so daft, but I'd be interested in your thoughts.

Best Answer

You are on the right track.

The parent model would naturally contain a list of child models, e.g. a customer having multiple orders.

When ParentViewModel is created and loaded by a third-party, it is passed a ParentModel. Then the ParentViewModel will:

  1. Assign the ParentModel to a local variable
  2. Create a ChildViewModel for each ChildModel by passing the ChildModel to the ChildViewModel constructor
  3. Add each of those ChildViewModels to a list

By the way, you want

public List<ChildViewModel> ChildViewModels { get; set; }

to be

public ObservableCollection<ChildViewModel> ChildViewModels { get; set; }
Related Topic