angular - 如何使用 selectionmodel 实现对所有树项的选择？

Question

我有一棵树，里面有一系列物品。我像这样组织了选项列表更改活动。

checklistSelection = new SelectionModel<TodoItemFlatNode>(true);
this.checklistSelection.changed.subscribe(data => {
  this.selectedEmit.emit(this.checklistSelection.selected.map(s => s.item));
});

以前，用户只能通过单击来选择树元素。一切都很好。我现在添加了一个“全选”按钮。

public SelectAllNode(): void {
 this.checklistSelection.clear();
 if (this.isCheckedAllNode) {
   for (let dataNode of this.treeControl.dataNodes) {
     this.checklistSelection.select(dataNode);
   }
 } else {
   for (let dataNode of this.treeControl.dataNodes) {
     this.checklistSelection.deselect(dataNode);
   }
 }
}

我的树中有 3000 多个项目。当用户单击此按钮时，会发生 3000 个事件 - 非常不切实际。请告诉我如何最好地组织所有元素的选择？例如，取消订阅一个事件，最后再订阅一次？

标签： angulartypescripttreeselectall

Answer 1

当我这样做时，问题似乎消失了：

public SelectAllNode(): void {
  this.checklistSelection.clear();
  if (this.isCheckedAllNode) {
    this.checklistSelection.select(...this.treeControl.dataNodes);
  } else {
    this.checklistSelection.deselect(...this.treeControl.dataNodes);
  }
}

但我不知道这有多好。