Angular 1.5 custom directive not being executed before native angular directives

Question

I'm in the process of migrating from Angular 1.2.17 to Angular 1.5.8 and, and i've noticed that a directive I've wrote is not being executed anymore before any other directives as it used to be the case with Angular 1.2.17. I've tried to set the priority at my directive level to 1500, even a very big value like 9999999999999999999 but no effect.

Any idea on how I can fix this problem?

Thanks

Sample code is available here: DEMO

var sample = here

To see how it worked in 1.2.x just change the angular version

Answer 1

Instead of adding a DOM event handler to cleanup the input, add a $parser to the ng-model controller to do the cleanup.

app.directive('nesCleanupInput', [function() {
  return {
    require: "ngModel",
    restrict: 'A',
    priority: 99999999999999999999999999999999999,
    link: function(scope, element,attrs,ngModel) {
      //USE $parsers pipeline
      ngModel.$parsers.push(function nesCleanup (value) {
        let cleanup = value.toUpperCase();
        element.val(cleanup);
        return cleanup;
      });
      /*
      //REMOVE DOM event handler
      element.on('change input keyup', function(event) {
        onChange (event);
      });
      */
});

The problem was that DOM event handler of the input directive was fighting the DOM event of the nes-cleanup-input directive. Using the $parsers pipeline avoids this problem.

The DEMO on PLNKR .

From the Docs:

$parsers

Array of functions to execute, as a pipeline, whenever the control reads value from the DOM. The functions are called in array order, each passing its return value through to the next. The last return value is forwarded to the $validators collection.

Parsers are used to sanitize / convert the $viewValue .

-- AngularJS ng-model Controller API Reference - $parsers