web-dev-qa-db-ja.com

Angular Material 6.0.1ツリーがデフォルトで開かれ、すべて展開/折りたたみます

プロジェクトでAngular Material Treeを使用しています。デフォルトでツリーを開くことは可能ですか？.

そして、すべてのノードを一度に展開/折りたたむ方法があるかもしれません（例えばボタンで）

https://material.angular.io/components/tree/overview

angulartreeangular-material
5
saibot

MatTreeのtreeControlは、すべてのツリーノードを展開するために使用できるexpandAllメソッドと、すべてのツリーノードを閉じるためのcollapseAllメソッドを提供します。

MatTreeを介してViewChildのインスタンスを作成し、expandAllライフフックでngAfterViewInitを呼び出して、デフォルトで展開させることができます。

@ViewChild('tree') tree;

ngAfterViewInit() {
  this.tree.treeControl.expandAll();
}

テンプレートから呼び出すソースの例：

<button (click)="tree.treeControl.collapseAll()">collapseAll</button>
<button (click)="tree.treeControl.expandAll()">expandAll</button>
<mat-tree #tree [dataSource]="dataSource" [treeControl]="treeControl">
  ...
<mat-tree>

例を参照してください。

16
Pengyy

さらに、treeControlノードが設定されていることを確認してください。データを読み込んだ後は

treeControl.dataNodes = nodes; 
treeControl.expandAll()

このgithubの問題を参照

0
Pipo