значок мата не отображает значок динамически в подпункте дерева мата

#angular #angular-material #mat-icon

Вопрос:

Я хочу показать значок перед подпунктом, но когда я использую его динамически, он не отображается на моей странице. Здесь lt;mat-icon *ngIf="node.icon"gt;{{node.icon}}lt;/mat-icongt; это не работает.

 component.ts      const TREE_DATA: RouteNode[] = [  {  name: 'PATIENT',  children: [  { path: '/patient/list', icon: 'format_list_numbered_rtl' , name: 'PATIENT LIST', class: 'router-link-active'},  { path: '/patient/history', icon: 'history', name: 'PATIENT HISTORY', class: 'router-link-active'},  ]  },  {  name: 'MEDICINE',  children: [  { path: '/medicine/list', icon: 'format_list_numbered_rtl', name: 'MEDICINE LIST', class: 'router-link-active'},  { path: '/medicine/purchase', icon: 'inventory', name: 'PURCHASE MEDICINE', class: 'router-link-active'},  ]  },  {  name: 'APPOINMENT',  children: [  {path: '/visitentries/list', icon: 'format_list_numbered_rtl', name: 'VISIT ENTRIES', class: 'router-link-active'},  {path: '/prescription/list', icon: 'format_list_numbered_rtl', name: 'PRESCRIPTION', class: 'router-link-active'},  ]  }  ];    component.html   lt;mat-tree [dataSource]="dataSource" [treeControl]="treeControl"gt;  lt;!-- This is the tree node template for leaf nodes --gt;  lt;mat-tree-node *matTreeNodeDef="let node" matTreeNodePadding matTreeNodePaddingIndent="20"gt;  lt;!-- use a disabled button to provide padding for tree leaf --gt;  lt;button mat-icon-button disabledgt;lt;/buttongt;  lt;a [routerLink]="[node.ROUTES]" routerLinkActive="link-active" gt;  lt;mat-icon *ngIf="node.icon"gt;{{node.icon}}lt;/mat-icongt;   {{node.name}}lt;/agt;  lt;/mat-tree-nodegt;  lt;!-- This is the tree node template for expandable nodes --gt;  lt;mat-tree-node *matTreeNodeDef="let node;when: hasChild" matTreeNodePadding matTreeNodePaddingIndent="20"gt;  lt;button mat-icon-button matTreeNodeToggle  [attr.aria-label]="'Toggle '   node.name"gt;  lt;mat-icon class="mat-icon-rtl-mirror"gt;  {{treeControl.isExpanded(node) ? 'expand_more' : 'chevron_right'}}  lt;/mat-icongt;  {{node.name}}  lt;/buttongt;  lt;/mat-tree-nodegt;  lt;/mat-treegt;  

Комментарии:

1. вы уверены, что значок будет внутри тега привязки ссылки?

2. весь угловой значок материала работает как есть.