Menu
I am using the editable-text directive from the xeditable module for AngularJS. Is there a way to disable the directive for the entire page?
I thought about using replacing editable-text with {{variable}}, where variable="editable-text" to enable and variable="somethingElse" to disable. However, this produces meaningless attributes in the html.
824
It is possible to remove directive with another directive. For this, new directive should have higher priority than the one being removed, then in compilation state you search for elements with required directive and remove tag/class/element wholetogether. Here's a very simple realisation of this:
.directive("disableDirective", function () {
function compile (el, attr) {
var hasDirective = el[0].querySelectorAll("["+attr.disableDirective+"]");
[].forEach.call(hasDirective, function (el) {
el.removeAttribute(attr.disableDirective);
});
}
return {
priority: 100000,
compile: compile
};
})
In the following HTML DIV will be visible, thanks to our directive:
<body disable-directive="ng-hide">
<div ng-hide="true">Hidden</div>
</body>
You'll have to set disable-directive="editable-text" for the page.
JSBin.
71
If you just want to turn off this directive across all app forever, I know two ways:
Create decorator for this directive and just set the compile function to empty function e.g. to angular.noop. Check this stuff for more info: https://docs.angularjs.org/api/auto/service/$provide#decorator .
Or you can also create directive with the same name and restrictions (A|E|C|M), but with higher priority and terminal property setted to true. But you should always keep in mind that this directive will turn off all directives with lower priority on the same element. (so this solution looks like antipattern for me)
20
answered Mar 29 '26 06:03
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
