How do I handle right-click events in angular.js?

Question

Is there a way to have an element set up so that it performs one action on left-click (ng-click) and then another action on a right-click?

Right now I have something

Answer 1

One way is using a directive that binds an event handler to contextmenu event. I had hard time stopping bubbling to prevent default menu to show up so added native script handler for document. Tried with e.stopPropagation(), e.preventDefault() , return false etc . Checking for target in document handler seems to work well

app.directive('rightClick',function(){
    document.oncontextmenu = function (e) {
       if(e.target.hasAttribute('right-click')) {
           return false;
       }
    };
    return function(scope,el,attrs){
        el.bind('contextmenu',function(e){
            alert(attrs.alert);               
        }) ;
    }
});

Right click me

DEMO http://plnkr.co/edit/k0TF49GVdlhMuioSHW7i