Reputation: 11474
I have an existing 3rd party directive for which I need to modify model and view values before they are shown resp. saved to the model. As I would like to avoid modifying external code, I implemented an additional directive which is set via attribute and which is about to modify the data through the $formatters
and $parsers
pipeline.
Basically something like this:
app.directive('myModifyingDirective', function() {
return {
require: 'ngModel',
restrict: 'A',
link: function(scope, element, attrs, ngModelController) {
ngModelController.$formatters.push(function(modelValue) {
return 'modified_' + modelValue;
});
// similar for $parsers
}
};
});
Markup looks something like:
<third-party-directive my-modifying-directive ng-model='data'></third-party-directive>`
The problem is, that third-party-directive
also contributes to the $formatters
, and at the end, the third-party-directives
's formatter is last entry in the $formatters
array, and thus executed before my-modifying-directive
.
However, I require my-modifying-directive
to be executed first.
Is there any mechanism how I could influence the order of the $parsers
?
Upvotes: 1
Views: 588
Reputation: 18193
You can set the priority of the directive so that it is higher or lower than the priority of the 3rd party directive:
When there are multiple directives defined on a single DOM element, sometimes it is necessary to specify the order in which the directives are applied. The priority is used to sort the directives before their compile functions get called. Priority is defined as a number. Directives with greater numerical priority are compiled first. Pre-link functions are also run in priority order, but post-link functions are run in reverse order. The order of directives with the same priority is undefined. The default priority is 0.
Upvotes: 2