angular material context menu code example
Example: matmenutriggerfor right click
@Component({
selector: 'fl-home',
template:`
<mat-menu #contextmenu>
<div >
<button mat-menu-item>Clear all Paths</button>
</div>
</mat-menu>
<div [matMenuTriggerFor]="contextmenu" [style.position]="'absolute'" [style.left.px]="menuX" [style.top.px]="menuY" ></div>
<div class="container" (contextmenu)="onTriggerContextMenu($event);"> ....</div>
`})
export class HomeComponent {
menuX:number=0
menuY:number=0
@ViewChild(MatMenuTrigger,{static:false}) menu: MatMenuTrigger;
onTriggerContextMenu(event){
event.preventDefault();
this.menuX = event.x - 10;
this.menuY = event.y - 10;
this.menu.closeMenu() // putting this does not work.
this.menu.openMenu()
}
}