PrimeNG Turbotable主选择不会在页面更改时更新

Question

我正在使用带有复选框的PrimeNG Turbotable来选择页面上的所有项目。页面更改时，主选择复选框未更新时，我遇到了问题。

可在plnkr https://next.plnkr.co/edit/YFIfVpER0FFaoiQU?preview

上找到源代码。

Answer 1

我必须重写Turbotable的toggleRowsWithCheckbox和updateCheckedState这两种方法来实现这一点。如果有人对我的操作方式或代码感兴趣，请参见下面的内容。这放在我的TurboTable包装器的构造函数中。

TableHeaderCheckbox.prototype.updateCheckedState = function () {
  const currentRows = _.map(this.dt.value, this.dt.dataKey);
  const selectedRows = _.map(this.dt.selection, this.dt.dataKey);
  this.rowsPerPageValue = this.dt.rows;
  const commonRows = _.intersection(currentRows, selectedRows);
  return commonRows.length === currentRows.length;
};

Table.prototype.toggleRowsWithCheckbox = function (event, check) {
  let _selection;
  if (!check) {
    _selection = this.value.slice();
    _.each(_selection, (row) => {
      const match = {}; match[this.dataKey] = row[this.dataKey];
      _.remove(this._selection, match);
    });
  } else {
    _selection = check ? this.filteredValue ? this.filteredValue.slice() : this.value.slice() : [];
    _.each(this._selection, (row) => {
      const match = {}; match[this.dataKey] = row[this.dataKey];
      _.remove(_selection, match);
    });
    this._selection = this._selection.concat(_selection);
  }

我对某些操作使用了“ lodash”，例如intersection，map，remove，each等。