javascript - angular material 两个复选框，一次只能勾选一个

Question

我是 Angular-material 的新手，所以这个问题听起来有点傻，但请耐心等待。

我有两个复选框，如下所示。

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

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

Answer 1

您可以在 checked 属性上设置条件，如本例所示:

typescript :

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