Angular 角度：如何管理*ngFor中的单个复选框

您好，我已经显示了一个带有复选框的项目列表

我希望用户能够为其中一个项目单击此复选框。它将取消选中以前选中的复选框

<tr *ngFor="let item of items>
 <td>
    <input type="checkbox value = "{{ item[i] }}">
  </td>
</tr>

我已经尝试了我所知道的一切，但我做不到。如果我选中一个复选框，另一个将保持选中状态

1-有可能做我想做的事吗？

---

2-我该怎么办？

在这种情况下，最好使用

单选按钮

但是您可以通过编程控制
复选框的行为
，因此一次只选择一个复选框

你可以看看这个，这可能对你有帮助

模板文件

<ul>
  <ng-container *ngFor="let item of items">
    <li>
      <input 
         type="checkbox" 
        [value]="item.value"
        [checked]="item.isChecked"
        (change)="onChange($event);"
        > {{item.label}}
    </li>
  </ng-container>
</ul>

使用代码是可能的，但如果只能选择一个选项，我建议使用单选按钮
items = [
      {'label': 'A', 'value': 'A', isChecked: false},
      {'label': 'B', 'value': 'B', isChecked: false},
      {'label': 'C', 'value': 'C', isChecked: false},
      {'label': 'D', 'value': 'D', isChecked: false},
      {'label': 'E', 'value': 'E', isChecked: false},
      {'label': 'F', 'value': 'F', isChecked: false},
      {'label': 'G', 'value': 'G', isChecked: false}
    ]; 

  onChange(event: any) { 
    const {checked, value} = event.target;
    let index = this.items.length;
    while(index--) {
       this.items[index].isChecked = value === this.items[index]['value'];
    }
  }