AngularJS禁用指令 | AngularJS禁用指令

本文介绍了AngularJS禁用指令的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我正在使用AngularJS的 xeditable 模块中的 editable-text 指令.有没有办法禁用整个页面的指令?

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?

我考虑过用 {{variable}} 替换可编辑文本，其中 variable ="editable-text" 启用和 variable ="somethingElse"禁用.但是，这会在html中产生毫无意义的属性.

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.

推荐答案

可以使用另一个指令删除指令.为此，新指令的优先级应高于要删除的指令的优先级，然后在编译状态下搜索具有必需指令的元素，然后一起删除标记/类/元素.这是一个非常简单的实现:

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
    };
})

由于我们的指令，在以下HTML DIV中将可见:

In the following HTML DIV will be visible, thanks to our directive:

<body disable-directive="ng-hide">
  <div ng-hide="true">Hidden</div>
</body>

您必须为页面设置 disable-directive ="editable-text" .

JSBin .

这篇关于AngularJS禁用指令的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！