根据状态更改mat-checkbox值

Question

我希望mat-checkbox值有2个不同的值，例如：如果选中它则等于1，如果未选中则等于2。

我不知道如何做到这一点，因为关于这个主题的文章很少。

Answer 1

检查这个StackBlitz：CheckBox value example

在您的HTML文件中：

<mat-checkbox (click)="clicked()">Check me!</mat-checkbox>

{{ checkBoxValue }}

在您的TS文件中：

export class AppComponent  {
  checkBoxValue: number = 1;
  checked: boolean = false;

  clicked() {
    this.checked = !this.checked;

    if (this.checked) 
      this.checkBoxValue = 2;
    else
      this.checkBoxValue = 1;
  }
}