Angular14中如何禁用指定mat-checkbox而非全部复选框

当前实现全量禁用复选框的核心原因是isDisable方法逻辑错误：

• 现有逻辑是「只要选项对象在rawData数组中存在，就返回true执行禁用」，但所有自动补全渲染的选项本身就来自rawData，因此所有选项都会命中禁用规则
• 方法内没有编写针对Car、Motor两个目标选项的匹配逻辑，不符合需求
  *额外隐患：使用indexOf匹配对象依赖引用一致性，如果filteredData管道返回的是新生成的对象，会出现匹配失效的问题，稳定性差。

1. 修改TS层禁用判断逻辑 #

直接根据选项的展示字段item做精确匹配，仅命中需要禁用的两个选项时返回true，替换原有isDisable方法即可：

// mautocomponent.ts
isDisable(obj: any){
  // 配置需要禁用的选项列表
  const disabledItemList = ['Car', 'Motor'];
  // 命中列表才返回禁用状态
  return disabledItemList.includes(obj.item);
}

2. 模板层无需调整结构 #

你现有模板中已经同时给mat-option和内部的mat-checkbox绑定了[disabled]="isDisable(data)"，修改TS逻辑后，外层选项和内层复选框的禁用状态会自动同步，不会出现点击穿透、状态不一致的交互问题。

验证提示：修改后除Car、Motor外的其他选项复选框可正常勾选，两个目标选项会处于灰化不可点击状态，符合预期。

内容的提问来源于stack exchange，提问作者EMahan K