Angular 9 中基于条件/事件的启用/禁用复选框

Posted 2023-02-22

【中文标题】Angular 9 中基于条件/事件的启用/禁用复选框

【英文标题】：Conditionally/event-based enable/disable check box in angular9

【发布时间】：2021-06-16 05:51:03

【问题描述】：

 <div ><label>Status:<select id="status" >
    <option >all</option>
    <option value="r">R</option>
    <option value="c">C</option>
    <option value="re">RE</option>
    <option value="de">DE</option>
  </select></label></div>    

如何根据选择有条件地或基于事件以 angular9 方式（模板指令等）启用或禁用此复选框。

<label>CHECK:<input type="checkbox" id="check" /></label>

【问题讨论】：

查看这个答案***.com/a/55856563/11812564

【参考方案1】：

您能举个例子说明您正在尝试做什么吗？

如果您使用的是响应式表单，@Saad 在评论部分提供的答案看起来就像您正在寻找的一样。

否则，您可能正在寻找属性绑定，请参阅此处https://***.com/a/37160409

在 html 模板中你会有这样的东西：

<label>CHECK:<input type="checkbox" id="check" [disabled]="isDisabled" /></label>

在组件打字稿文件中，你会有这样的东西：

@Component(
  selector: 'app-component-overview',
  templateUrl: './component-overview.component.html',
  styleUrls: ['./component-overview.component.css']
)
export class ComponentOverviewComponent 
   isDisabled = false; // handle this variable to enable or disable your component

【讨论】：

请同时描述如何启用或禁用选项选择...