javascript - How to remove directive before it gets processed by angular? -
i trying create directive encapsulates label , input field:
<form-field label="name" ng-model="person.name"></form-field>
directive definition:
app.directive("formfield", function(){ var ignoreattrs = ["label"]; return { priority: 3, //so executes before ngmodel. template: "<div>" + "<label>{{label}}</label>" + "<input type='text' />" + "</div>", scope: true, compile: function(telement, tattrs){ var $input = telement.find("input"); //copy attributes directive element inner input field var attrs = []; $.each(telement[0].attributes, function(index, attr){ if(ignoreattrs.indexof(attr.label) < 0){ attrs.push(attr.name); $input.attr(attr.name, attr.value); } }); //remove attributes directive element $.each(attrs, function(index, attr){ telement.removeattr(attr); }); return function postlink(scope, element, attrs){ scope.label = attrs.label; }; } }; });
the problem i'm running when angular traverses dom finds 2 directives: form-field , ng-model. causes ng-model set in form-field element , in input, when intent have ng-model in input.
is there way tell angular ignore directive or there earlier moment in lifecycle when can run logic copies , removes attributes angular not find ng-model directive in form-field?
a possible solution have other directives have prefix angular not recognize them, in compile function of form-field remove prefix before copying input i'm looking cleaner solution.
since terminate
may cause undesirable side-effects, simple , trouble-free solution decorate directives keep them compiling:
app.config(function($provide){ var blacklisteddirectives = ['ngmodel']; angular.foreach(blacklisteddirectives, function (directive) { $provide.decorator(directive + 'directive', function ($delegate) { angular.foreach($delegate, function (ddo) { var compile_ = ddo.compile || function () {}; ddo.compile = function (element) { if (element.attr('form-field') !== undefined || element.prop('tagname').tolowercase() == 'form-field') return; return compile_.apply(this, arguments) || ddo.link; }; }); return $delegate; }); }); });
Comments
Post a Comment