title: Detect changes in objects inside array in Angular2
body: <p>Using Angular 2 and typescript. I have an array that I use DoCheck and IterableDiffer to listen to changes in my code. When the array is changed I get notifications, but when a property inside one of the objects in the array changes I don't get notified.
  I tried using KeyValueDiffer but it doesn't work.
  I think maybe I need to use the "_differs.find" differently.
  Any ideas?</p>
  
  <pre><code>@Component({
      selector: 'test'
  })
  @View({
      template: `
      &lt;div&gt;hello!&lt;/div&gt;`
  })
  export class MyComponent implements DoCheck {
  
  private _differ: IterableDiffer;
  private _differ2: KeyValueDiffer;
  _myItems: MyItem[];
  @Input()
  set myItems(value: MyItem[]) {
      this._myItems = value;
  
      if (!this._differ &amp;&amp; value) {
          this._differ = this._iterableDiffers.find([]).create(null);
      }
      if (!this._differ2 &amp;&amp; value) {
          this._differ2 = this._differs.find(this._myItems).create(null);
      }
  }
  get myItems() {
      return this._myItems;
  }
  
  constructor(private _iterableDiffers: IterableDiffers, private _differs: KeyValueDiffers, private _myService: MyService) {
      this.myItems = _myService.getItems();
  }
  
  ngDoCheck() {
  
      var changes = this._differ.diff(this._myItems);
  
      if (changes) {
          changes.forEachAddedItem((record) =&gt; {
              console.log('added ' + record.item);
          });
          changes.forEachRemovedItem((record) =&gt; {
              console.log('removed ' + record.item);
          });
      }
  
      var changes2 = this._differ2.diff(this._myItems);
      if (changes2) {
          changes2.forEachChangedItem(
              (record) =&gt; {
                      console.log(record.key + "," + record.currentValue);
                  }
              });
      }
    }
  }
  </code></pre>
  
  <p>There is no way to get notified on changes in one of the properties of MyItem</p>