Запуск динамически генерируемых mat-меню с массивом объектов - PullRequest
0 голосов
/ 02 января 2019

Я хочу создать боковую панель для приложения. У меня есть массив объектов, поступающий из серверной части. Я пытаюсь добиться этого с помощью компонента Mat-Menu. Который открывает меню (подмодули), когда я наведите курсор на модуль. Но когда я наведу курсор на динамически создаваемое меню, оно не обновится. Другими словами, никакое другое меню не запускается, если уже открытое меню не закрыто вручную. Ниже приведен мой фрагмент кода. Обычно мне нужно, чтобы меню открывалось при наведении на него, и любое открытое меню должно быть закрыто.

    <div class="float-left mt-4 pt-2 sidebar">
  <div *ngFor="let list of app_feature_list; let i=index">
    <div class="sidemenu-container">
      <div #menuTrigger="matMenuTrigger" [matMenuTriggerFor]="menu" (mouseenter)="menuTrigger.openMenu()" [matMenuTriggerData]="{name: list.modules}" class="p-4"> 
         <i class="fa {{list.class}} {{list.groupIcon}} custom-icon"></i>
        </div>
    </div>

<mat-menu class="ml-5" #menu="matMenu" [overlapTrigger]="true" `enter code here`xPosition="after" yPosition="below">
            <ng-template matMenuContent let-name="name">
              <div (mouseleave)="menuTrigger.closeMenu()">
                 <mat-action-list  *ngFor="let module of name; let i=index">
                    <mat-list-item>{{module.feature_name}}</mat-list-item>
                    <mat-divider></mat-divider>
                </mat-action-list>
              </div>
              </ng-template>
        </mat-menu>
  </div>
</div>
...