angular - 基于数组中的布尔值需要选中和取消选中 nz zorro angular 中表格的复选框
问题描述
我在一个带有复选框的 nz zorro 表中工作。我有一个场景,我需要根据布尔值检查清单。我试图在一个名为 item checked 的方法中传递布尔值和数据索引,值也可以通过,但未选中复选框。/ html /
<div nz-row class="content">
<nz-table [class.overflow]="xOverflow" #rowSelectionTable [nzLoading]="loading" [nzData]="listOfData"
[nzScroll]="{x: xscroll, y: yscroll}">
<thead>
<tr>
<th nzLeft nzWidth="35px" [nzChecked]="checked" (nzCheckedChange)="onAllChecked($event)"
[nzIndeterminate]="indeterminate"></th>
<th nzEllipsis class="itm-category">
Item Category
</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of rowSelectionTable.data;let i = index;"
[ngClass]="{'highlight': selectedIndex.indexOf(i) > -1 }">
<td nzLeft [nzChecked]="setOfCheckedId.has(i)" (nzCheckedChange)="onItemChecked(i, $event)"></td>
<td class="itm-category">{{data.name}}</td>
</tr>
</tbody>
</nz-table>
</div>
ts--文件
this.listOfData=[ {id: 2, name: "SUITING", code: "SU", description: null, mapped: true},
{id: 1, name: "SHIRTING", code: "SH", description: null, mapped: false}]
for (let i in this.listOfData) {
this.onItemChecked(i,this.listOfData[i].mapped);
}
onAllChecked(checked: boolean): void {
let allStatuslist;
if (!checked || this.selectedIndex.length > 0) {
this.selectedIndex = [];
}
this.listOfData.forEach((_item, i) => {
this.updateCheckedSet(i, checked)
});
this.refreshCheckedStatus();
}
refreshCheckedStatus(): void {
this.checked = this.listOfData.every((_item, i) => this.setOfCheckedId.has(i));
this.indeterminate = this.listOfData.some((_item, i) => this.setOfCheckedId.has(i)) && !this.checked;
}
updateCheckedSet(id: any, checked: boolean): void {
if (checked) {
this.selectedIndex.push(id);
this.setOfCheckedId.add(id);
if (this.selectedIndex.length > 0) {
this.selectedIndex.sort(function (a, b) { return a - b; })
}
} else {
if (this.setOfCheckedId.size <= 1 && this.selectedIndex.length <= 1) {
this.selectedIndex = [];
}
else {
const index = this.selectedIndex.indexOf(id);
this.selectedIndex.splice(index, 1);
}
this.setOfCheckedId.delete(id);
}
this.selectedIndex = [...this.selectedIndex]
}
onItemChecked(id: any, checked: boolean): void {
console.log(id, checked);
this.updateCheckedSet(id, checked);
this.refreshCheckedStatus();
}
该值在 itemChecked 方法中调用,但未检查清单。对此的任何解决方案
解决方案
推荐阅读
- r - 为什么 r 不像 spss 那样在 0 和 1 中编码因子来计算 $r$ 系数?
- python-3.x - 将整数分配给数据框字段`OverflowError: Python int too large to convert to C unsigned long`
- git - 当我从 dockerfile 执行 git clone 时,我怎么知道我在哪个 git 分支上
- c# - 设置父按钮禁用?
- http - Flutter http.post 从不返回响应
- android - AndroidX数据绑定生成错误
- .net-core - 在 dotnet core 2.1 中编译后的 appsettings 在哪里
- c# - 运算符“||” 不能应用于“object”和“bool”类型的操作数
- regex - 如何将 grep 与文件中的正则表达式和模式一起使用?
- java - Java设置所有小数点的双精度值并且只得到小数点后2位