title: WPF/MVVM : How to bind model to view/viewmodel from ItemsControl
body: <p>I have an ItemsControl bound to a list of <code>Tasks</code>. And I would like to give that model <code>Task</code> to its view <code>TaskView</code> and viewmodel <code>TaskViewModel</code>.</p>
  
  <p>I have try to bind values on the view property like that :</p>
  
  <pre><code>&lt;views:TaskView Model="{Binding}" /&gt;
  </code></pre>
  
  <p>And then bind the values between the view and the view model :</p>
  
  <pre><code>public partial class TaskView
  {
      public TaskView()
      {
          InitializeComponent();
  
          // Attempt to bind view.IdProperty with viewmodel.Id
          var binding = new Binding("Id");
          SetBinding(IdProperty, binding);
      }
  
      public Task Model
      {
          get { return GetValue(ModelProperty) as Task; }
          set { SetValue(ModelProperty, value); }
      }
      public static readonly DependencyProperty ModelProperty =
        DependencyProperty.Register("Model", typeof(Task), typeof(TaskView));
  }
  </code></pre>
  
  <p>However it does not work. Since I'm a newbie in C#/.NET, I have no clue whether I'm in the right direction or not, because it seems to be complicated for a common problem IMO.</p>
  
  <p><em>Note that it properly renders the list of tasks, so ItemsControl works as expected.</em></p>
  
  <p>Questions :</p>
  
  <ol>
  <li>How to build a view from a datasource and pass a model to that view? (Problem explained above)</li>
  <li>How to read values from that model to the view? (See TaskView.xaml)</li>
  <li>Is there a more idiomatic way of doing that?</li>
  </ol>
  
  <hr>
  
  <p>Here are the key parts :</p>
  
  <p><strong>Model</strong></p>
  
  <pre><code>namespace Models
  {
    public class Task
    {
      public string Id { get; set; }
  
      public Status Status { get; set; }
  
      // And other properties ...
    }    
  }
  </code></pre>
  
  <p><strong>List (parent)</strong></p>
  
  <p>ViewModel</p>
  
  <pre><code>public class ListViewModel : ActionViewModelBase
  {
      public ObservableCollection&lt;Task&gt; Tasks { get; set; }
  }
  </code></pre>
  
  <p>View</p>
  
  <pre><code>&lt;ItemsControl x:Name="Tasks"
                  Grid.Row="1"
                  Grid.ColumnSpan="2"
                  ItemsSource="{Binding Path=Tasks, Mode=OneWay}"&gt;
      &lt;ItemsControl.ItemsPanel&gt;
          &lt;ItemsPanelTemplate&gt;
              &lt;StackPanel Orientation="Vertical" /&gt;
          &lt;/ItemsPanelTemplate&gt;
      &lt;/ItemsControl.ItemsPanel&gt;
      &lt;ItemsControl.ItemTemplate&gt;
          &lt;DataTemplate DataType="models:Task"&gt;
              &lt;!-- TODO : Bind model to task view/viewmodel --&gt;
              &lt;views:TaskView Model="{}" /&gt;
          &lt;/DataTemplate&gt;
      &lt;/ItemsControl.ItemTemplate&gt;
  &lt;/ItemsControl&gt;
  </code></pre>
  
  <p><strong>Task (child)</strong></p>
  
  <p>TaskView.xaml.cs</p>
  
  <pre><code>public partial class TaskView
  {
      public TaskView()
      {
          InitializeComponent();
      }
  
      public Task Model
      {
          get { return GetValue(ModelProperty) as Task; }
          set { SetValue(ModelProperty, value); }
      }
      public static readonly DependencyProperty ModelProperty =
        DependencyProperty.Register("Model", typeof(Task), typeof(TaskView));
  }  
  </code></pre>
  
  <p>TaskView.xaml</p>
  
  <pre><code>&lt;UserControl&gt;
    &lt;UserControl.DataContext&gt;
      &lt;viewModels.TaskViewModel /&gt;
    &lt;/UserControl.DataContext&gt;
  
    &lt;Border&gt;
        &lt;!-- TODO : Read model attributes --&gt;
        &lt;Grid Background="{Binding Path=Model.Status, Converter={StaticResource StatusBackgroundColourConverter}}"&gt;
            &lt;!-- ... --&gt;
        &lt;/Grid&gt;
    &lt;/Border&gt;
  &lt;/UserControl&gt;
  </code></pre>
  
  <p>TaskViewModel</p>
  
  <pre><code>class TaskViewModel : ActionViewModelBase
  {
      public Task Model { get; set; }
      // ...
  }    
  </code></pre>