title: WPF Binding TabControl TabItem
body: <p>I am relatively new to MVVM in WPF and have been trying to solve an issue for several days now.  I am using the dragablz tab control and binding the ItemsSource which is an ObservableList of objects.  The content of the Tab Item is a UserControl, however; its datacontext is <code>null</code>.  I've created a simple setup to demonstrate the issue I'm having:</p>
  
  <p><strong>Model/ViewModel Classes:</strong></p>
  
  <pre><code>public class Item
  {
      public string Header { get; set; }
      public ItemContent Body { get; set; }
  }
  
  public class ItemContent
  {
      public string Name { get; set; }
      public string Description { get; set; }
  }
  
  class MainWindowViewModel : INotifyPropertyChanged
  {
      public event PropertyChangedEventHandler PropertyChanged;
  
      protected void OnPropertyChanged([CallerMemberName]string propertyName = null)
      {
          PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
      }
  
      public ObservableCollection&lt;Item&gt; Items { get; set; }       
  }
  </code></pre>
  
  <p><strong>Main Window XAML</strong></p>
  
  <pre><code>&lt;Window x:Class="WpfTestApplication.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:WpfTestApplication"
      xmlns:views="clr-namespace:WpfTestApplication.ViewModels"
      xmlns:dragablz="clr-namespace:Dragablz;assembly=Dragablz"
      xmlns:dockablz="clr-namespace:Dragablz.Dockablz;assembly=Dragablz"
      mc:Ignorable="d"
      Title="MainWindow" Height="350" Width="525"&gt;
  &lt;Window.DataContext&gt;
      &lt;views:MainWindowViewModel /&gt;
  &lt;/Window.DataContext&gt;
  &lt;Grid&gt;
      &lt;Grid.RowDefinitions&gt;
          &lt;RowDefinition Height="Auto" /&gt;
          &lt;RowDefinition /&gt;
      &lt;/Grid.RowDefinitions&gt;
      &lt;Button Name="btnAdd" Content="Add" Click="btnAdd_Click" /&gt;
      &lt;dockablz:Layout Grid.Row="1"&gt;
          &lt;dragablz:TabablzControl HeaderMemberPath="Header" ItemsSource="{Binding Items}" SelectedIndex="1"&gt;
              &lt;dragablz:TabablzControl.ContentTemplate&gt;
                  &lt;DataTemplate DataType="{x:Type views:Item}"&gt;
                      &lt;local:TabItemControl /&gt;
                  &lt;/DataTemplate&gt;
              &lt;/dragablz:TabablzControl.ContentTemplate&gt;
          &lt;/dragablz:TabablzControl&gt;
      &lt;/dockablz:Layout&gt;
  &lt;/Grid&gt;
  &lt;/Window&gt;
  </code></pre>
  
  <p><strong>Tab Item XAML</strong></p>
  
  <pre><code>&lt;UserControl x:Class="WpfTestApplication.TabItemControl"
           xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
           xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
           xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
           xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
           xmlns:local="clr-namespace:WpfTestApplication"
           xmlns:views="clr-namespace:WpfTestApplication.ViewModels"
           mc:Ignorable="d" 
           d:DesignHeight="300" d:DesignWidth="300"&gt;
  &lt;UserControl.DataContext&gt;
      &lt;views:ItemContent /&gt;
  &lt;/UserControl.DataContext&gt;
  &lt;Grid&gt;
      &lt;TextBox Text="{Binding Body}" /&gt;
  &lt;/Grid&gt;
  &lt;/UserControl&gt;
  </code></pre>
  
  <p><strong>And the btnAdd_Click event</strong></p>
  
  <p>Note that I don't use this in my actual code but it was a fast and dirty way to add tab items dynamically without adding a command.</p>
  
  <pre><code>    private void btnAdd_Click(object sender, RoutedEventArgs e)
      {
          ((ViewModels.MainWindowViewModel)DataContext).Items.Add(new ViewModels.Item() { Header = "New One", Body = new ViewModels.ItemContent() { Name = "This One" } });
      }
  </code></pre>