antd中checkbox的全选和反选:
https://ng.ant.design/version/0.7.x/components/checkbox/zh
代码如下:
// 全选和反选
updateAllChecked(): void {
this.indeterminate = false;
if (this.allChecked) {
this.checkOptionsOne.forEach(item => item.checked = true);
} else {
this.checkOptionsOne.forEach(item => item.checked = false);
}
}
// 单个选择
updateSingleChecked(): void {
if (this.checkOptionsOne.every(item => item.checked === false)) {
this.allChecked = false;
this.indeterminate = false;
} else if (this.checkOptionsOne.every(item => item.checked === true)) {
this.allChecked = true;
this.indeterminate = false;
} else {
this.indeterminate = true;
}
}
注:如果checkOptionsOne中刚开始就没有checked属性,那么是错误的。
所以下面的方法,使用了:
!value.checked // undefined和false的情况都可以使用,且出去了disabled的情况
undefined === false // false
table模块中实现方式:
// 单个选择
refreshStatus(): void {
const allChecked = this.displayData.filter(value => !value.disabled).every(value => value.checked === true);
const allUnChecked = this.displayData.filter(value => !value.disabled).every(value => !value.checked);
this.allChecked = allChecked;
this.indeterminate = (!allChecked) && (!allUnChecked);
}
// 全选和反选
checkAll(value: boolean): void {
this.displayData.forEach(data => {
if (!data.disabled) {
data.checked = value;
}
});
this.refreshStatus();
}
全选和反选后,再去走单个判断逻辑。

&spm=1001.2101.3001.5002&articleId=102489258&d=1&t=3&u=01c1bf02833f49fc95bda261c68d5691)
3374

被折叠的 条评论
为什么被折叠?



