角度6:根据条件禁用动态复选框

时间:2019-04-25 14:35:00

标签: angular checkbox angular-reactive-forms dynamic-forms

我有一个带有重复复选框列表的动态表单。请参阅https://stackblitz.com/edit/angular-5jdnb5

如果在一个复选框列表中选中了一个复选框选项,则必须在其他列表中禁用同一选项。例如,如果在第一个列表中选中了 Life 选项,则应该在其他列表中禁用Life复选框。

我如何实现逻辑。请提出建议。

2 个答案:

答案 0 :(得分:1)

每次复选框的内容更改时,您只需要将其报告到首页即可。在此报告过程中与事件进行通信是一个很好的解决方案。以下是您要的经过纠正且正在运行的应用程序。我将在稍后编辑答案。

https://stackblitz.com/edit/angular-bzqbeq

答案 1 :(得分:1)

我创建了一个简化的演示HERE,大众可以理解。

这里的主要概念是维护选项对象和相应的列表ID,用于维护要禁用的列表选项。

无需在组件之间传递数据,只需对组件模板进行简单的对象操作即可启用/禁用复选框