javascript - AngularJS - 从元素中动态删除指令

Question

从已编译和链接的元素中动态添加或删除指令的正确方法是什么？

我有一个页面，上面有一堆输入(列表很长，所以我想提出一个通用的解决方案)。如果设置了特定标志，我想做的是禁用所有输入。我可以使用 jQuery 的 element.prop('disabled', true) 来做到这一点。

这种方法的问题是，如果任何输入附加了 ng-disabled 或 ng-enabled 指令，那么在对它们的任何表达式修改时，它们将覆盖先前设置的“禁用”属性。但我希望他们不要覆盖我的全局标志。

我想出了为 ng-disabled 或 ng-enabled 表达式添加另一组观察者的解决方案，但这似乎不是最好的方法。

我想做的是删除大部分附加到元素的指令并自己设置适当的属性。但是如果我重新编译并重新链接该元素，然后在文档中替换它，那么我将发生内存泄漏，因为旧元素将从 DOM 文档树中分离出来，并保留在内存中。我也不能破坏元素的范围，因为这些元素基本上使用整个页面的主范围。

Answer 1

你可以尝试类似的东西

<div ng-show="someBoolean" >Some text or nested element</div>

或者您可以附加一个解析为 bool 值的函数，而不是“someBoolean”。要设置您的 bool 值，您可以将 ng-click 附加到您的输入以更新您的模型/ bool 值

<button type="button" ng-click="setBoolean()">Some text or nested element </button>

由于 Angular 双向数据绑定(bind)，ng-show 将在下一个摘要周期完成时更新