Question

有没有一种方法可以根据在列上进行的拖放来更新Angular Material表的数据源（行）？

我有一个dropListedDrop事件会更新列：

dropListDropped(event: CdkDropList, index: number) {
  if (event) {
    moveItemInArray(this.headers, this.previousIndex, index);
    this.setDisplayedColumns();
  }
}

但是，拖放操作完成后，dataSource中的数据不会自动更改。

此处的示例：StackBlitz

Answer 1

它提到here，为了优化性能，Angular Material表不会自动更新。要更新表，您只需在表上调用renderRows()。

您可以像这样@ViewChild(MatTable) table: MatTable<any>;访问该表然后称为table.renderRows();

Answer 2

dropListDropped(event: CdkDropList, index: number) {
  if (event) {
    moveItemInArray(this.headers, this.previousIndex, index);
    this.headers = [...this.headers];
  }
}

在线演示HERE（即使您有Angular管道过滤器，此解决方案也可以使用）

角材料表的拖放列不会更新行

2 个答案: