angular - 如何更新 mat-tree 以处理将子节点添加到叶节点(将叶节点转换为父节点)

Question

我正在使用 Angular Material6 Tree component带有复选框。

在 Original Example , 我们只能将新的子节点添加到父节点。如果我想在 leaf node 中添加一个新的 child 怎么办？ .

Answer 1

虽然这是一个老问题，但我会为那些再次询问如何做的人回答。

首先，将+按钮添加到叶子节点:

<button mat-icon-button (click)="addNewItem(node)"><mat-icon>add</mat-icon></button>

然后，使用一个小技巧来刷新树。

refreshTree() {
    let _data = this.dataSource.data;
    this.dataSource.data = [];
    this.dataSource.data = _data;
  }

我在数据更改订阅中添加了对 refreshTree 函数的调用:

_database.dataChange.subscribe(data => {
        this.dataSource.data = data;
        this.refreshTree();
      });