角度材料两个复选框，一次只能检查一个

Posted 2021-04-07

我对Angular材料很新，所以这个问题听起来有点傻，但请耐心等待。

我有两个复选框如下。

<mat-checkbox>Apply for Job</mat-checkbox>
<mat-checkbox>Modify a Job</mat-checkbox>

假设用户选中了第一个复选框（“申请工作”），然后点击“修改工作”复选框，我希望应用程序自动取消选中第一个复选框。如何在不使用单选按钮的情况下实现此目的？

答案

您可以在checked属性上添加条件，如下例所示：

打字稿：

selected=-1;

html

<div *ngFor="let item of [1,2,3];  let i = index">
  <mat-checkbox [checked]="selected === i" (change)="selected = i">Check me!</mat-checkbox>
</div>

DEMO