How to handle right click event in Angular app?

Question

In Angular is there a way to catch right click events? I see (click) and (dblclick), but when I try (rightclick) it does not trigger any events. Is there a way to include right click events and have them be handled by a function similar to the click and dblclick if it does not exist?

Answer 1

The event name is contextmenu. So, your html template code can be something like this:

<div (contextmenu)="onRightClick($event)"></div> 

$event is an optional parameter so your template and event handler can look like this:

<div (contextmenu)="onRightClick()"></div>  onRightClick() {     return false; } 

NOTE: You can return false; to avoid default browser action from the event.

Answer 2

The event name is "contextmenu", so you should use something like this:

<button (contextmenu)="onRightClick($event)"> Right click me </button> 

Then the onRightClick function should look something like this:

onRightClick(event) {  event.preventDefault() //this will disable default action of the context menu  //there will be your code for the expected right click action }