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

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 like:

<span ng-click="increment()">{{getPointsSpent()}}</span>

And I'd like to also be able to right click on the span to perform the function decrement();

You can use a directive to bind specific action on right click, using the contextmenu event :

app.directive('ngRightClick', function($parse) {
    return function(scope, element, attrs) {
        var fn = $parse(attrs.ngRightClick);
        element.bind('contextmenu', function(event) {
            scope.$apply(function() {
                event.preventDefault();
                fn(scope, {$event:event});
            });
        });
    };
});

Code example on fiddle

Hi this is an old question but I have a solution that I think may be simpler in some cases. The ngMousedown (and ngMouseup) directives are triggered by the right mouse button and have access to the original mouse event through $event so you could do it this way:

<span ng-mousedown="handleClick($event)"
      oncontextmenu="return false">  <!-- use this to prevent context menu -->
          {{getPointsSpent()}}
</span>

Then in the controller, you can do the following:

$scope.handleClick(evt) {
    switch(evt.which) {
        case 1:
            increment(); // this is left click
            break;
        case 2:
            // in case you need some middle click things
            break;
        case 3:
            decrement(); // this is right click
            break;
        default:
            alert("you have a strange mouse!");
            break;
    }
}

Here is a working fiddle. It works the same as the accepted answer but doesn't require the creation of a whole new directive. Although a directive may be a better solution, especially if you plan to attach right-click functions to lots of things. But anyway, another option.