ループ内のngModelバインディングを変更する

Question

申し訳ありませんが、この問題を正しく記述する方法はわかりません。

フォームを出力しようとしていますが、オブジェクトキーの配列をループし、オブジェクトのプロパティの数に応じて入力フィールドを表示します。例えば

：

<form [ngFormModel]="dataForm" (ngSubmit)="save()"> 
    <fieldset> 
     <legend>Data</legend> 
     <div class="form-group" *ngFor="#key of dataKeys" 
      <label>{{ key }}</label> 
      <input 
       [(ngModel)]="data." + key 
       class="form-control" 
       ngControl="key" 
       #key="ngForm"> 
     </div> 
    </fieldset> 
</form> 

そして、私はそれがこれに評価したい：

<form [ngFormModel]="dataForm" (ngSubmit)="save()"> 
    <fieldset> 
     <legend>Data</legend> 
     <div class="form-group"> 
      <label>id</label> 
      <input 
       [(ngModel)]="data.id" 
       class="form-control" 
       ngControl="id" 
       #id="ngForm"> 
     </div> 
     <div class="form-group"> 
      <label>score</label> 
      <input 
       [(ngModel)]="data.score" 
       class="form-control" 
       ngControl="score" 
       #score="ngForm"> 
     </div> 
     ... 
    </fieldset> 
</form> 

私は、現時点では、テンプレートでそれを持っているように、それは働くことができないことを知っているが、私はちょうどそれが適切に動作するようにする方法を理解できません。 私はおそらくカスタムの方向性が解決策だと思ったが、私はこれを見つけることができたすべてのGoogleの結果を精査した後でも、私はそれを動作させることはできない。

ありがとうございます！

Answer 1

これは、あなたが欲しいものを行う必要があります。

[(ngModel)]="data[key]"