角形材のテーブルソートwith formControl

Question

ソートをクリックすると、配列によってフォームコントロールがある列のデータ&のコントロールが正しく更新されないという問題があります。期待どおりに他の列はすべて更新されています。以下はformControlsを持っているコードは次のとおりです。ここで

<form [formGroup]="rackAverageForms[i]"> 
      <md-input-container> 
      <input [formControl]="rackAverageForms[i].controls.rackAverage" #rackAverage 
        formControlName="rackAverage" 
        (keydown.tab)="validateRackAverage(rackAverage,i)" class="numeric-field" [numberOnly]="true" 
        mdInput value="{{row.chosenDateRackAverage | currency:'USD':true:'1.4-4'}}"> 
      <md-error><strong>{{formErrors[i].rackAverage}}</strong></md-error> 
      </md-input-container> 
</form> 

は前一種のスクリーンショットです： md-table view before trying to sort

これは、ソートした後で、データがなくなって： md-table view after sorting with missing data

時には1がありますその値はハングしますが、ほとんどの場合、この列のすべての値がなくなり、コントロールも消えてしまいます。助けてください。

Answer 1

いくつかのことを試した後、row.idの一意の値を使用してformcontrolを参照するように切り替えると、現在動作しています。下記の固定HTMLをご覧ください：

 <form [formGroup]="rackAverageForms[row.id]"> 
      <ng-container *ngIf="row.chosenDateRackAverage > 0"> 
      <md-input-container> 
       <input [formControl]="rackAverageForms[row.id].controls.rackAverage" #rackAverage 
        formControlName="rackAverage" 
        (keydown.tab)="validateRackAverage(rackAverage,row.id)" class="numeric-field" [numberOnly]="true" 
        mdInput value="{{row.chosenDateRackAverage | currency:'USD':true:'1.4-4'}}" > 
       <md-error><strong>{{formErrors[row.id].rackAverage}}</strong></md-error> 
      </md-input-container> 
      </ng-container> 
     </form>