ngModel不綁定select tag中的ngFor選項

Question

 <form> <table> <tr *ngFor="let p of ArrayObject"> <td> <div> <select class="form-control input-sm" [(ngModel)]="p.tag" name="tag" #required> <option ngValue="YES">YES</option> <option ngValue="NO" >NO</option> </select> </div> </td> </tr> </table> </form> 

我使用ngFor在表單中設置一個多選標簽，它沒有表單標簽，但在表單標簽內似乎沒有正確設置該值。

Answer 1

您需要在ngValue中添加方括號，以將其標識為綁定目標屬性。 它應該看起來像這樣[ngValue]

<form>
  <table>
    <tr *ngFor="let p of ArrayObject; let index = index; trackBy:trackByIndex;">
      <td>
        <div>
          <select class="form-control input-sm" [(ngModel)]="p.tag[index]" name="tag{{index}}" #required>
            <option [ngValue]="YES">YES</option>
            <option [ngValue]="NO">NO</option>
          </select>
        </div>
      </td>
    </tr>
  </table>
</form>

在component.ts上，您需要定義trackByIndex方法：

// initialise with the following values to test if it is working
p = {
  tag: ['YES', 'YES', 'NO'] 
};

trackByIndex(index: number, obj: any) {
  return index;
}