Question

我正在使用有角度的材料。我使用垫复选框。我遇到了问题，当我从备份中获取数据“ N”并单击检查时，它更改为“ Y”，但从“ Y”更改为“ N”不变。 DEMO供您参考。

HTML

<mat-checkbox (change)="blocked = $event?'Y':'N'" color='primary' [ngModel]="blocked === 'Y'" > IS Blocked?</mat-checkbox>


<br><br>
checkbox is {{blocked}}

组件

blocked:any='N';

Answer 1

您可以简单地

<mat-checkbox (change)="onChange($event)" color='primary' [ngModel]="blocked == 'Y' ? true : false" > IS Blocked?</mat-checkbox>

并在 checkbox-overview-example.ts 中放置下面的功能。

onChange(event){
   this.blocked = event.checked ? 'Y' : 'N';
}

希望这会有所帮助！

Answer 2

您可以简单地这样做：

<mat-checkbox (change)="blocked = !blocked" color='primary'> IS Blocked?</mat-checkbox>

checkbox is {{blocked ? 'N' : 'Y'}}

Answer 3

如果您使用（更改）您应该使用 $event.checked，请参阅the docs

<mat-checkbox (change)="blocked = $event.checked?'Y':'N'" 
              [checked]="blocked === 'Y'" > IS Blocked?</mat-checkbox>

如果你使用 (ngModelChange) 你使用 $event

<mat-checkbox (ngModelChange)="blocked = $event?'Y':'N'" 
               [ngModel]="blocked === 'Y'" > IS Blocked?</mat-checkbox>

注意：我喜欢使用对 (ngModelChange)/[ngModel] 或对 (change)/[checked]

Answer 4

代替：

<mat-checkbox (change)="blocked = $event?'Y':'N'" color='primary' [ngModel]="blocked === 'Y'" > IS Blocked?</mat-checkbox>

使用：

<mat-checkbox (change)="blocked = $event.checked?'Y':'N'" color='primary' [ngModel]="blocked === 'Y'" > IS Blocked?</mat-checkbox>

垫复选框为“ Y”时不变

4 个答案: