Turbotable：p-tableHeaderCheckbox选择禁用的行

Question

我在PrimeNG TurboTable上遇到问题。

我从以下示例开始：https://www.primefaces.org/primeng/#/table/selection，尤其是从“复选框选择”示例开始。

唯一的区别是，我在某些p-tableCheckbox上添加了 [disabled] =“ true”

如果我选择一个禁用的行，它不会被激活并且无法被选择，则效果很好，但是当我单击p-tableHeaderCheckbox时，所有行都被选中，即使是禁用的行。

此外，该选择还会对处于禁用状态的行进行计数，或者只接受没有禁用状态的行 我在stackblitz上做了一个例子：https://stackblitz.com/edit/angular-gnbsml?file=src%2Fapp%2Fapp.component.html

如何防止tableHeaderCheckbox也选择禁用行？

预先感谢您的回答

Answer 1

您可以防止在表的（selectionChange）回调中进行选择。将[（selection）]分成两部分：

[selection]="selectedRowData" (selectionChange)="onSelectionChange($event)"

向组件添加onSelectionChange方法：

  onSelectionChange(selection: any[]) {
    for (let i = selection.length - 1; i >= 0; i--) {
      let data = selection[i];
      if (this.isRowDisabled(data)) {
        selection.splice(i, 1);
      }
    }
    this.selectedRowData = selection;
 }

还添加isRowDisabled方法：

  isRowDisabled(data: any): boolean {
    return data.color === 'orange'
  }

并更改tableCheckbox的模板以使用isRowDisabled（仅用于在一个地方签入）

<p-tableCheckbox [value]="rowData" [disabled]="isRowDisabled(rowData)"></p-tableCheckbox>

请参见https://stackblitz.com/edit/angular-hnzxs2上的示例（我还添加了逻辑，以从headerHeadBox状态的计算过程中排除禁用的行）

Answer 2

当我们仅禁用过滤器后的行时，它会失败。我已经通过检查活动行来修复它。

ss + 1