title: AngularJS: extend input directive
body: <p>I was wondering, if it is possible, to extend Angular's input directive? I want to attach some listeners to all input fields on a page. I think you can decorate existing modules with <code>$provide.decorate</code>, but I have no idea how to do this with a directive (and more precisely the input directive).</p>
  
  <p>So, can anyone push me in the right direction? Some examples?</p>
  
  <p><strong>EDIT</strong></p>
  
  <p>Here is my directive that I have so far:</p>
  
  <pre><code>angular.module('onFocusBlur').
  directive('onFocusBlur', ["$rootScope", function($rootScope) {
    return {
      restrict: "A",
      link: function(scope, elem, attrs) {
          elem.bind('focus',function() {
            scope.$apply(function() {
              $rootScope[attrs.onFocusBlur] = true;
            });
          });
          elem.bind('blur',function() {
            scope.$apply(function() {
              $rootScope[attrs.onFocusBlur] = false;
            });
          });
      }
    };
  }]);
  </code></pre>
  
  <p>In my view, I can add this to an input field like this:</p>
  
  <pre><code>&lt;input type="email" ng-model="email" on-focus-blur="repositionNavBar"&gt;
  </code></pre>
  
  <p>The downside is, that for every input field, I have to attach this listener manually in my code. Therefore, it would be useful, to alter the existing input directive, to include this listeners.</p>