Angular directive conditional click: eactClickIf

eatClickIf.directive.js

(function(angular) {
    'use strict';

    angular
        .module('app')
        .directive('eatClickIf', directive);

    directive.$inject = [
        '$parse',
        '$rootScope'
    ];

    function directive($parse, $rootScope) {
        // This ensure eatClickIf be compiled before ngClick.
        return {
            'priority': 100,
            'restrict': 'A',
            'compile': compile
        };

        function compile($element, attributes) {
            var fn = $parse(attributes.eatClickIf);
            return {
              pre: function link(scope, element) {
                var eventName = 'click';
                element.on(eventName, function(event) {
                  var callback = function() {
                    if (fn(scope, {$event: event})) {
                      // Prevents ng-click to be executed.
                      event.stopImmediatePropagation();
                      // Prevents href.
                      event.preventDefault();
                      return false;
                    }
                  };
                  if ($rootScope.$$phase) {
                    scope.$evalAsync(callback);
                  } else {
                    scope.$apply(callback);
                  }
                });
              },
              post: function() {}
          };
        }
    }

})(angular);