AngularJS – how to override directive ngClick

by

Every directive is a special service inside AngularJS, you can override or modify any service in AngularJS, including directive

For example remove built-in ngClick

angular.module('yourmodule',[]).config(function($provide){
    $provide.decorator('ngClickDirective', ['$delegate', function($delegate) {
        //$delegate is array of all ng-click directive
        //in this case first one is angular buildin ng-click
        //so we remove it.
        $delegate.shift();
        return $delegate;
    }]);
});

angular support multiple directives to the same name so you can register you own ngClick Directive

angular.module('yourmodule',[]).directive('ngClick',function (){
  return {
    restrict : 'A',
    replace : false,
    link : function(scope,el,attrs){
      el.bind('click',function(e){
        alert('do you feeling lucky');
      });
    }
  }
});

check out http://plnkr.co/edit/U2nlcA?p=preview
I wrote a sample that removed angular built-in ng-click and add a customized ngClick

More Related Contents:

  1. angular ng-bind-html and directive within it
  2. How to call a method defined in an AngularJS directive?
  3. How to use a keypress event in AngularJS?
  4. Angular directives – when and how to use compile, controller, pre-link and post-link [closed]
  5. Angularjs dynamic ng-pattern validation
  6. Easiest way to pass an AngularJS scope variable from directive to controller?
  7. Using angularjs filter in input element
  8. if a ngSrc path resolves to a 404, is there a way to fallback to a default?
  9. How to autocapitalize the first character in an input field in AngularJS?
  10. Ng-click doesn’t work inside ng-repeat
  11. How to understand the `terminal` of directive?
  12. Custom form validation directive to compare two fields
  13. AngularJS : ng-repeat filter when value is greater than
  14. AngularJS Group By Directive without External Dependencies
  15. How to modify scope from within a directive in AngularJs
  16. Binding variables from Service/Factory to Controllers
  17. How to use “ng-repeat” within template of a directive in Angular JS?
  18. AngularJS custom form component / directive using ng-model
  19. How can you limit the value from input using AngularJS?
  20. How to set the dynamic controller for directives?
  21. Can you change templateUrl on the fly?
  22. Enable/Disable Anchor Tags using AngularJS
  23. Illegal use of ngTransclude directive in the template
  24. Understanding the transclude option of directive definition?
  25. angularjs text area character counter
  26. ng-click doesn’t work within the template of a directive
  27. Angular ng-click event delegation
  28. Dynamic content added with AngularJS click event not working on the added content
  29. creating a new directive with angularjs
  30. AngularJS – Directives vs Controllers

Leave a Comment