Question

我有一个使用*ngFor构建的动态复选框列表。每当我手动选中复选框时，模型都会更新，但如果模型预设为有复选框，则不会在加载时检查该框。

<form action="demo_form.asp" method="get">
  <div *ngFor="let d of data; let in=index; trackBy:trackByIndex">
    <input type="checkbox" 
           name="value" 
           [(ngModel)]="data[in].value"
           [(checked)]="data[in].value" 
           (change)="checkChanged($event)"/>
    {{d.text}}
  </div>      
</form>

我在trackBy中使用原语时已经了解到您需要我们ngFor所以这是我的trackByIndex：

public trackByIndex(index: number, data: TextValuePair): any {
   return index;
}

以下是数据：

public data = [{ text: "Human", value: true }, { text: "Dog", value: false }]

如果列表中的对象value设置为＆＃34; true＆＃34;

，我需要在加载时选中复选框

Answer 1

发现问题。它在<form>内部变得混乱。删除<form>，您可以将代码简化为此。

  <div *ngFor="let d of data">
    <input type="checkbox" 
           name="data" 
           value="{{d.text}}"
           [(ngModel)]="d.value"
           (change)="checkChanged($event)"/>
    {{d.text}}
  </div>

应该有效

在Angular 2中使用* ngFor时，复选框不应用检查加载

1 个答案: