title: MVVM binding to a User Control with an ObservableCollection dependency property
body: <p>I have designed a user control with an ObservableCollection dependency property and would like it to be consumed by a MVVM light application.  If I set the property in the consuming view's code behind, it works like a charm, but not so when I attempt to use xaml binding as intended with a view-model.  </p>
  
  <p>In the control's code-behind I define the dependency property:</p>
  
  <pre><code>/// &lt;summary&gt;
  /// The &lt;see cref="ItemsSource" /&gt; dependency property's name.
  /// &lt;/summary&gt;
  public const string ItemsSourcePropertyName = "ItemsSource";
  
  /// &lt;summary&gt;
  /// Gets or sets the value of the &lt;see cref="ItemsSource" /&gt;
  /// property. This is a dependency property.
  /// &lt;/summary&gt;
  public List&lt;string&gt; ItemsSource
  {
      get
      {
          return (List&lt;string&gt;)GetValue(ItemsSourceProperty);
      }
      set
      {
          SetValue(ItemsSourceProperty, value);
      }
  }
  
  /// &lt;summary&gt;
  /// Identifies the &lt;see cref="ItemsSource" /&gt; dependency property.
  /// &lt;/summary&gt;
  public static readonly DependencyProperty ItemsSourceProperty = DependencyProperty.Register(
      ItemsSourcePropertyName,
      typeof(List&lt;string&gt;),
      typeof(ListEditor), new PropertyMetadata(new List&lt;string&gt;(), OnItemsSourcePropertyChanged));
  
  private static void OnItemsSourcePropertyChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
  {
      ListEditor listEditor = d as ListEditor;
      while (listEditor._stackPanel.Children.Count &gt; 1)
      {
          listEditor._stackPanel.Children.RemoveRange(0, listEditor._stackPanel.Children.Count - 2);
      }
  
      List&lt;string&gt; newCollection = e.NewValue as List&lt;string&gt;;
  
      foreach (string item in newCollection)
      {
          ListItemEditor newItem = new ListItemEditor();
          newItem.Text = item;
          newItem.RemoveItem += listEditor.listItemEditor_RemoveItem;
  
          listEditor._stackPanel.Children.Insert(listEditor._stackPanel.Children.Count - 1, newItem);
      }
  } 
  </code></pre>
  
  <p>In the view I bind the control:</p>
  
  <pre><code>&lt;ucl:ListEditor ItemsSource="{Binding PartNumbers}"/&gt;
  </code></pre>
  
  <p>In the view model I define the property:</p>
  
  <pre><code>/// &lt;summary&gt;
  /// The &lt;see cref="PartNumbers" /&gt; property's name.
  /// &lt;/summary&gt;
  public const string PartNumbersPropertyName = "PartNumbers";
  
  private ObservableCollection&lt;string&gt; _partNumbers = new ObservableCollection&lt;string&gt;();
  
  /// &lt;summary&gt;
  /// Sets and gets the PartNumbers property.
  /// Changes to that property's value raise the PropertyChanged event. 
  /// &lt;/summary&gt;
  public ObservableCollection&lt;string&gt; PartNumbers
  {
      get
      {
          return _partNumbers;
      }
  
      set
      {
          if (_partNumbers == value)
          {
              return;
          }
  
          RaisePropertyChanging(PartNumbersPropertyName);
          _partNumbers = value;
          RaisePropertyChanged(PartNumbersPropertyName);
      }
  }
  </code></pre>
  
  <p>What can I do to facilitate the binding effectively?</p>