角度反応性のフォームdatepickerの値を保存

Question

私はdatepickerで動的コントロールを持っています。 datepickerの値を保存するにはどうすればよいですか？

<tr *ngFor="let item of items"> 
    <td style="padding-right: 20px">{{item.id}}</td> 
    <td style="padding-right: 20px"> 
     <md-input-container> 
      <input mdInput [mdDatepicker]="estDate1" placeholder="Choose a date" [value]="item.estimatedDate"> 
      <button mdSuffix [mdDatepickerToggle]="estDate1" [value]="item.estimatedDate"></button> 
     </md-input-container> 
     <md-datepicker #estDate1></md-datepicker> 
    </td> 
</tr> 

これは私のモックコンポーネントの実装です：

getData() { 
     this.itemsForm = this.fb.array([this.item]); 

     this.items = [{ 'id': '1', 'estimatedDate': '01/01/2017'}, 
      { 'id': '2', 'estimatedDate': '02/01/2017'}, 
      { 'id': '3', 'estimatedDate': '03/01/2017'}, 
      { 'id': '4', 'estimatedDate': '04/01/2017'}  
     ]; 
    } 

    saveData(){ 
     this.itemsForm.setValue({ 
      .... 
     }); 

    } 

私はdymanically datepickersからデータを収集し、サービスに渡す配列にバインドする方法がわからないです。

Answer 1

item.estimatedDateで双方向バインドを行う場合は、[(ngModel)]を使用してください。

<input mdInput placeholder="Choose a date" 
    [mdDatepicker]="estDate1" 
    [(ngModel)]="item.estimatedDate"> 

は、デモ用のthis plunkerを参照してください。