/
githubmirror
/
components
Обзор
Документация
Войти
/
githubmirror
/
components
Код
Запросы
0
Пакеты
0
Релизы
0
Аналитика
Безопасность
main
src/components-examples/material/tree/tree-nested-overview/tree-nested-overview-example.html
25 строк
1 KB
Olawuni Olagoke
docs(material/tree): update examples to use modern childrenAccessor API (#32751)
26 мар 2026, 16:42
Не верифицирован
26 мар 2026, 16:42
9055ac5
Код
Авторство
О чём код?
<mat-tree #tree [dataSource]="dataSource" [childrenAccessor]="childrenAccessor" class="example-tree"> <!-- This is the tree node template for leaf nodes --> <!-- There is inline padding applied to this node using styles. This padding value depends on the matIconButton width. --> <mat-nested-tree-node *matTreeNodeDef="let node"> {{node.name}} </mat-nested-tree-node> <!-- This is the tree node template for expandable nodes --> <mat-nested-tree-node *matTreeNodeDef="let node; when: hasChild" matTreeNodeToggle [cdkTreeNodeTypeaheadLabel]="node.name"> <div class="mat-tree-node"> <button matIconButton matTreeNodeToggle [attr.aria-label]="'Toggle ' + node.name"> <mat-icon class="mat-icon-rtl-mirror"> {{tree.isExpanded(node) ? 'expand_more' : 'chevron_right'}} </mat-icon> </button> {{node.name}} </div> <!-- There is inline padding applied to this div using styles. This padding value depends on the matIconButton width. --> <div [class.example-tree-invisible]="!tree.isExpanded(node)" role="group"> <ng-container matTreeNodeOutlet></ng-container> </div> </mat-nested-tree-node> </mat-tree>