HTML
TS
CSS
<mat-tree [dataSource]="dataSource" [treeControl]="treeControl">
<mat-tree-node *matTreeNodeDef="let node" matTreeNodePadding>
<button mat-icon-button class="hidden"></button>
{{node.name}}
</mat-tree-node>
<mat-tree-node *matTreeNodeDef="let node;when: hasChild" matTreeNodePadding>
<button mat-icon-button matTreeNodeToggle class="icon-button"
[attr.aria-label]="'toggle ' + node.name" color="black">
<set-icon shape="chevron_right"
[attr.dir]="treeControl.isExpanded(node) ? 'right' : 'up'">
</set-icon>
</button>
{{node.name}}
</mat-tree-node>
</mat-tree>