如何以编程方式设置或重置复选框

Question

用途：当一个特定的复选框被选中或取消选中时，程序必须根据编程规则更改其他一些复选框。

<input type="checkbox" id="chkbox" (change)="onChangeChk($event)">Test Checkbox

  onChangeChk($event) {
    $event.srcElement.value = "on"; // or "off"
  }

无论 onChangeChk 如何设置，复选框都保持其原始状态。

感谢您对此的帮助。 :-)

Answer 1

您可以将输入元素的 checked 属性赋值为 true 或 false。

像这样：

onChangeChk($event) {
    $event.srcElement.checked = true; // or false
}

另见此处：https://www.w3schools.com/jsref/prop_checkbox_checked.asp

Answer 2

如果你有一个 CheckBox:

<mat-checkbox
  [checked]="filterStatusPrivatUser"
  #privatUserCheckbox>Privat User</mat-checkbox>

您可以使用 ViewChild 访问 checked 属性，如下所示：

import { ElementRef } from '@angular/core';

filterStatusPrivatUser: boolean = true;

@ViewChild('privatUserCheckbox') privatUserCheckbox: ElementRef;

然后像这样以编程方式更改值：

changeCheckboxProgramatically() {
    this.privatUserCheckbox['checked'] = true;
}

如何以编程方式设置或重置复选框

how to programmatically set or reset checkbox

checkbox

programmatically

angular