admin管理员组

文章数量:1287828

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.

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.

  • javascript
  • angularjs
Share Improve this question edited Feb 13, 2014 at 2:48 Klaster_1 Нет войне 12.2k9 gold badges64 silver badges75 bronze badges asked Feb 13, 2014 at 2:36 user2939415user2939415 8941 gold badge14 silver badges25 bronze badges 1
  • Is there a reason why you can't have a scope variable on the page controller, use ng-hide='booleanVar' on the directive tag and then toggle the booleanVar to show or hide? – edzillion Commented Jun 4, 2014 at 17:10
Add a ment  | 

3 Answers 3

Reset to default 8

It is possible to remove directive with another directive. For this, new directive should have higher priority than the one being removed, then in pilation 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 pile (el, attr) {
        var hasDirective = el[0].querySelectorAll("["+attr.disableDirective+"]");

        [].forEach.call(hasDirective, function (el) {
            el.removeAttribute(attr.disableDirective);
        });
    }

    return {
        priority: 100000,
        pile: pile
    };
})

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.

If you just want to turn off this directive across all app forever, I know two ways:

  1. Create decorator for this directive and just set the pile function to empty function e.g. to angular.noop. Check this stuff for more info: https://docs.angularjs/api/auto/service/$provide#decorator .

  2. 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)

I believe you can remove the restrict field using a decorator. this would disable the directive. Here is an example using ng-show

var app = angular.module("app", []);

//disable ng-show
app.config(function($provide) {
  $provide.decorator('ngShowDirective', function($delegate) {
    var directive = $delegate[0];

    directive.restrict = ""; 
    return $delegate;
  });
});

本文标签： javascriptAngularJS disable directiveStack Overflow

版权声明：本文标题：javascript - AngularJS disable directive - Stack Overflow 内容由网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：http://www.betaflare.com/web/1741324215a2372380.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。