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

  • Z时代
  • 2024-01-10
  • 分类：问答

我有一个使用*ngFor构建的CheckBox的动态列表。无论何时手动选中框，模型都会更新，但如果模型预设为具有复选框，则不会在装入时检查框。使用* ngFor在Angular 2中不应用检查时的复选框

<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>

我已经学会了你的ngFor所以这里使用内时原语需要我们trackBy是我trackByIndex：

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

下面是数据：

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

我需要的如果列表中的对象已将value设置为“true”，则在加载时检查复选框

回答：

发现问题。它在<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>

它应该工作

以上是 使用* ngFor在Angular 2中不应用检查时的复选框 的全部内容， 来源链接： utcz.com/qa/259632.html

回到顶部