javascript - ng-disabled 覆盖自定义指令行为

Question

我正在开发 AngularJS 客户端。我有一个用作属性的自定义指令。该指令检查元素的访问级别，如果当前用户不允许使用它，则将其设置为禁用。

当同一元素具有 ng-disabled 属性时，问题就开始了。在本例中，ng-disabled 设置元素的功能，而不必介意我在自定义指令中设置的内容。

例如我有一个按钮，应该禁用该按钮，以防表单无效。同时，我想使用我的自定义指令，以便在用户没有使用权限时将按钮设置为禁用。

<button ng-disabled="myFrm.myCtrl.$invalid" my-custom-directive="controlName"/>

在myCustomDirective内，我检查是否允许用户激活指定的控件。如果不是 - 我将禁用属性设置为该元素。但如果 myFrm.myCtrl.$invalid 为 false，ng-disabled 会删除禁用属性并启用按钮。

这个问题有解决办法吗？如何阻止 ng-disabled 执行其操作？

Answer 1

您的示例指令是否反射(reflect)了您如何将实际指令应用于按钮元素？我注意到您的示例指令没有遵循正确的命名约定，即使指令名称中的每个大写字母成为带有前导连字符的小写字母。即 myCustomDirective 应该应用于按钮，如下所示:

<button ng-disabled="myFrm.myCtrl.$invalid" my-custom-directive="controlName"/>

否则您的指令将不会被遵守或链接到该按钮。

在没有看到实际代码的情况下我能想到的唯一一件事是指令的优先级。根据the ngDisabled directive的 Angular 文档:

This directive executes at priority level 100.

默认情况下，自定义指令的优先级为 0。只要您没有更改此指令参数，您的指令就应该在 ng-disabled 之后编译并在 ng-disabled 之后链接，因此对是否按钮有最终决定权已禁用或启用。

-- 编辑-- 您应该按照另一个人的建议向 myFrm.myCtrl.$invalid 添加一个监视，并在值发生变化时重新应用您的指令规则。不过，您不需要将整个 Controller 传递到指令中，您可以简单地在 myFrm.myCtrl.$invalid 上使用两种方式绑定(bind)。我还不确定 $watch 优先级是如何工作的。我希望，因为您的指令将首先被编译，所以它将在 ngDisabled 执行后对 myFrm.myCtrl.$invalid 应用其监视，并希望这意味着它将在 ngDisable 执行后处理 myFrm.myCtrl.$invalid 的值更改，以便您的指令应用什么规则有最终决定权。