How to dynamically add a directive to all input elements in AngularJS across controllers & modules

Question

I want to add a directive dynamically to all my textboxes in all my controllers & forms. I got a hack from here : How to dynamically add a directive to an input element in AngularJS

but in my case: there are around 200+ forms spread across different controllers & modules & it will be very time consuming to add it everywhere.

Is there an easier or more elegant way to do it ?

Edit: What I want to do ? I want to remove all leading & trailing spaces entered by user in all input boxes.

Answer 1

Angular can have multiple directives with the same name, and will apply them all to the element. Create another input directive with the desired behavior (demo):

  .directive('input', function($compile) {
    return {
      restrict: 'E',
      require: '?ngModel',
      link: function(scope, elem, attrs, ngModel) {
        if (!ngModel) {
          return;
        }

        ngModel.$parsers.push(function(value) {
          return value.trim();
        });
      }
    }
  });

Answer 2

If you have any common class in your all forms yo can create a controller with that class name

.directive('form-class',function($compile){
    return{
        restrict: 'C',
        link: function(scope, elem, attrs){
        }
    }
})

Answer 3

The solution used by me to solve the problem (Extension of Ori Dori's answer) :

app.directive('input', function () { 
    return {
        require: '?ngModel',
        link: function (scope, element, attr, ngModelCtrl) {

            if (ngModelCtrl) {

                if (element.attr('type') == 'radio' || element.attr('type') == "file" || 
                    element.attr('type') == "checkbox" || element.attr('type') == "submit")
                {
                    //ignore them                    
                    return;
                }

                element.bind("change", function () {
                    if (element.val()) {
                        ngModelCtrl.$setViewValue(element.val().trim());
                        ngModelCtrl.$render();
                    }
                });
            }
        }
    };
});