Angular2 - 使用函数“表达式已更改...”更新 NGX-DataTable

Question

我有两张桌子。我的目标是在我的第一个表的一行上按下一个按钮，调用一个函数，然后让该函数将该行添加到我的第二个表中。

现在我的代码如下所示：

<ngx-datatable
      class='material'
      [rows]='rowsAll'
      ...
>
 <ngx-datatable-column 
   ...
  >
    <ng-template 
      ...
    > 
      <button (click)="addRow(value)">
        Add
      </button>
    </ng-template>
  </ngx-datatable-column>
</ngx-datatable>

<ngx-datatable
      class='material'
      [rows]='rowsSelected'
      ...
>
</ngx-datatable>

addRow(selectedRow){
  // Get row via value
  ...

  // Add Row
  this.rowsSelected.push(selectedRow);
  this.ref.markForCheck();
}

它可以工作，但是每当我单击偶数行时都会出现此错误：

表达式在检查后发生了变化。以前的值：'datatable-body-row datatable-row-odd'。当前值：'datatable-body-row datatable-row-even'。

在做了一些研究之后，我认为让 addRow() 更新第二个表会导致更改而不检查更改，这就是我添加 this.ref.markForCheck() 的原因 - 但这似乎没有任何作用改变。所以我仍然不知道如何解决这个问题。

我是否有正确的方法来更新第二个表的行，或者我是否应该像现在这样在更新第二个表后继续尝试手动触发检查的方法？还是我只是误解了其他东西？

Answer 1

如果您重新分配 rowsSelected 变量而不是推送到数组，那应该会触发 Angular 的更改检测并更新表格。

this.rowsSelected = [...this.rowsSelected, selectedRow];