Angular 6：材质复选框选中了循环中的所有复选框

Question

循环

  <li *ngFor="let item of verticalList;let i=index;">
  <mat-checkbox [(ngModel)]="checked" name="i">Checked</mat-checkbox>
</li>

我想给每个复选框一个不同的选中值。怎么做？

Answer 1

我不知道什么是verticalList类型，但是您使用id的对象列表可以执行以下操作：

verticalList = [
  {
    name: 'foo',
    checked: false
  },
  {
    name: 'foo1',
    checked: false
  },
  {
    name: 'foo2',
    checked: false
  }
]

<li *ngFor="let item of verticalList;let i=index;">
  <mat-checkbox [(ngModel)]="item.checked" name="i">Checked {{ item.name }}</mat-checkbox>
</li>