我正在利用角材料创建一个真棒网络应用程序。请考虑以下代码:
<mat-checkbox class="master" (click)='checkAll()'>Checkbox MASTER</mat-checkbox>
<mat-checkbox class="checkbox">Checkbox 2</mat-checkbox>
<mat-checkbox class="checkbox">Checkbox 3</mat-checkbox>
代码生成三个复选框。当选中第一个复选框时,其他两个复选框也应该被选中。如果没有选中第一个复选框,其他两个复选框应该正常工作。
在组件中:
checkAll() {
// How can I programmatically set the [checked] property here for .checkbox?
}
3条答案
按热度按时间slsn1g291#
这里有一个简单的解决方案,可以勾选任意数量的复选框。如果您手动勾选所有复选框,它还会更新主复选框:
组件类
组件模板
https://stackblitz.com/edit/checkbox-behavior?file=src%2Fapp%2Fapp.component.html
gupuwyp22#
下面是这样做的一个例子:
超文本标记语言
类别:
Demo
bgibtngc3#
将[checked]属性添加到第二个和第三个材质复选框:
在组件中使用false初始化“checkedWhenFirstIsChecked”。
并在函数中将其设置为true:
在“checked”周围加上[]表示已经创建了单向绑定,您只需要设置值。