我创建了一棵简单的树角度材质树 https://material.angular.io/components/tree/overview :
https://stackblitz.com/edit/angular-exhejg-vx5i7c?file=app/tree-dynamic-example.html https://stackblitz.com/edit/angular-exhejg-vx5i7c?file=app/tree-dynamic-example.html
<mat-tree [dataSource]="dataSource" [treeControl]="treeControl" >
<mat-tree-node *matTreeNodeDef="let node" matTreeNodePadding >
<button mat-icon-button ></button>
{{node.item}}
</mat-tree-node>
<mat-tree-node *matTreeNodeDef="let node; when: hasChild" matTreeNodePadding >
<button mat-icon-button
[attr.aria-label]="'toggle ' + node.filename" matTreeNodeToggle>
<mat-icon class="mat-icon-rtl-mirror">
{{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}
</mat-icon>
</button>
{{node.item + '2'}}
<mat-progress-bar *ngIf="node.isLoading"
mode="indeterminate"
class="example-tree-progress-bar"></mat-progress-bar>
</mat-tree-node>
</mat-tree>
看起来像 :
但如何添加支线呢?类似的东西(来自here https://tina-material-tree.firebaseapp.com/simple-tree):
没有现成的此类功能。但你可以通过 CSS 应用它。
有一个工作示例 https://stackblitz.com/edit/material-tree-nested
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)