Here is the current state of my code:
<mat-tree-node>
...
<div *ngIf="node.type=='assembly' || node.type=='part'" style="display: inline;"
(contextmenu)="asmStateServ.contextMenu($event, node.name)">{{node.instanceName}}
({{node.name}})
<div class="customContext" (click)="asmStateServ.stopPropagation($event)" #menu>
<ul>
<li (click)="asmStateServ.selectNode(node.name)">Select</li>
<li (click)="asmStateServ.deSelectNode(node.name)">Deselect</li>
</ul>
</div>
</div>
</mat-tree-node>
This is how it looks in the .ts file:
@ViewChild('menu') menu: ElementRef
public contextMenu(event: MouseEvent, node: asmTreeNode | asmTreeNodeFlat | asmTreeNodeScene) {
event.preventDefault();
this.menu.nativeElement.style.display = "block";
this.menu.nativeElement.style.top = event.pageY + "px"
this.menu.nativeElement.style.left = event.pageX + "px"
}
public disappearContextMenu() {
this.menu.nativeElement.style.display = "none";
}
public stopPropagation(event: any) {
event.stopPropagation();
}
However, the issue persists where the menu fails to open and a specific console error remains. Can you help me identify what may be causing this problem? I am fairly new to Angular and programming as a whole, so correct guidance would be greatly appreciated :)