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 等。