title: How to two-way bind an array of objects to child component from parent component in angular 2
body: <p>I have a parent component which has an array of objects</p>
  
  <pre><code>this.arr = [
  {
     style :'sample.css',
     disabled : this.formControl.valid
  },
  {
      style : 'sample.css',
      disabled : this.formControl.valid
  }];
  </code></pre>
  
  <p>Note : this.formControl.valid indicates whether is form is dirty or not.</p>
  
  <p>I am passing this array to child component</p>
  
  <pre><code>&lt;child-component [controlConfiguration] ='arr'&gt;&lt;/child-component&gt;
  </code></pre>
  
  <p>In child component i have exposed an Input variable</p>
  
  <pre><code>export class ChildComponent{
         @Input()
         controlConfiguration : any;
  }  
  </code></pre>
  
  <p>ChildComponent has following html </p>
  
  <pre><code>&lt;div&gt;
     &lt;button *ngFor='let item of controlConfiguration'  [disabled]='!item.disabled' &gt;&lt;/button&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>changes are not propagated from parent component to child component as expected result is button should get enable as soon as form gets valid.</p>
  
  <p>How to do this....??></p>