Skip to main content

Posts

Showing posts with the label Material Angular Menu

Material Angular,Material Angular Menu,Dynamic Material Angular Menu

Dynamic Angular Material Menu Refer Basics of Angular Material Menu from Material.IO Refer Angular Material Menu's Focus Idea Here we discussed Material Angular Menu's Dynamic Binding Import Material Angular MenuAPI  import {MatMenuModule} from '@angular/material/menu'; Directives Used MatMenu, MatMenuItem, MatMenuTrigger Step 1 :  Create SubmenuitemsComponent ng g c Submenuitems Step 2:In SubmenuitemsComponent.ts  @Input() SubMenuItems: Array<MenuItem>;
@ViewChild('Submenuitem') public Submenuitem;
@Output() SelectedMenu: EventEmitter<MenuItem> = new EventEmitter();
clickeventhandler(menu) {
this.SelectedMenu.emit(menu);
} Step 3:In SubmenuitemsComponent.html <mat-menu #Submenuitem="matMenu" [overlapTrigger]="false" >
  <div *ngFor="let submenu of SubMenuItems" >
<span *ngIf="submenu.SubMenuItems && submenu.SubMenuItems.length > 0" >
    <button  mat-menu-item   [matMenuTrigge…