Angular复选框：代码控制选中状态时绑定布尔值不更新的解决问询

首先要明确：Angular的[(ngModel)]本身就是双向绑定，正常情况下直接修改绑定的布尔属性，复选框状态会自动同步；反过来点击复选框，属性值也会自动更新。你遇到的代码控制时属性不同步问题，大概率是操作方式有误，或者额外添加的change事件干扰了绑定逻辑。

给你几个直接有效的解决步骤：

1. 移除多余的change事件处理 #

你添加的(Change)="getishighlylevaragedmeasure($event)"及对应的if-else完全没必要——[(ngModel)]已经帮你完成了状态同步，手动在change事件里赋值反而可能和ngModel的自动更新冲突，导致状态不一致。直接删掉这段代码即可。

2. 代码控制时直接修改绑定的布尔属性 #

在.ts文件里，只要直接给ishighlylevaragedmeasure赋值true/false，复选框就会自动选中/取消，同时属性值也会同步变化。示例代码：

// 代码控制复选框选中
this.ishighlylevaragedmeasure = true;

// 代码控制复选框取消选中
this.ishighlylevaragedmeasure = false;

3. 确保属性初始化为布尔类型 #

一定要在组件类里将这个属性初始化为布尔值，不能是undefined或其他类型，否则ngModel的双向绑定可能失效：

export class YourComponent {
  // 初始化布尔属性为false或true
  ishighlylevaragedmeasure = false;
}

4. 正确的HTML写法 #

只需要保留[(ngModel)]绑定即可，不需要额外事件：

<input type="checkbox" [(ngModel)]="ishighlylevaragedmeasure">
<!-- 可以添加显示区域验证同步效果 -->
当前状态值: {{ ishighlylevaragedmeasure }}

如果确实需要在状态变化时执行额外逻辑（比如发送请求、更新其他数据），不要手动修改属性，而是监听属性变化，比如用ngOnChanges：

import { Component, OnChanges, SimpleChanges } from '@angular/core';

export class YourComponent implements OnChanges {
  ishighlylevaragedmeasure = false;

  ngOnChanges(changes: SimpleChanges) {
    if (changes['ishighlylevaragedmeasure']) {
      // 在这里处理状态变化后的额外逻辑
      console.log('当前状态:', this.ishighlylevaragedmeasure);
    }
  }
}

内容的提问来源于stack exchange，提问作者manjunath c