ng-if中的AngularJS指令不会运行

Question

我有一个自定义指令myDirective，可以对元素执行任务。

我在ng-if块

中有这个指令

<div ng-if="condition">
    <div my-directive></div>
</div>

像这样的小提琴：http://jsfiddle.net/hGnvv/只有ng-if条件在加载$http请求后变为true。

该指令可能在运行时编译，但从未链接，因此代码永远不会运行。如果我将ng-if替换为ng-show，则该指令正常工作。

任何解决方案？

修改：我无法使用ng-show因为我在表单中有130个指令。无论如何都会运行20个指令，另一个根据我的对象类型运行。

• ng-if="type == 1"然后加载这些元素
• ng-if="type == 2"然后加载其他元素等。

如果我将ng-if更改为ng-show，表单需要加载8秒而不是1秒。

Answer 1

ng-if条件最初为false，因此该元素在DOM中不存在且指令未链接。

当ng-if条件稍后变为true时，链接回调应该正确触发，如以下示例所示：

单击按钮时将ng-if设置为true：http://jsfiddle.net/q05gret0/

在加载ng-if请求后将$http设置为true：http://jsfiddle.net/fhu8ky62/1/

如果您没有收到此行为，则问题可能出在继承范围内;检查ng-if是否正在监视请求更新的同一范围变量。 This article在父/子范围变量阴影和其他限制上有几点。

Answer 2

问题不在于该指令没有运行，而是我内部的$watch函数根本没有运行。我没有设法理解问题的确切原因，因为同一指令在ng-if之外正常工作。

无论如何将$watch改为 - ＆gt; $watchCollection它现在运行正常，因为它会看到我观看的对象的所有更新。

Answer 3

例如，如果您的模型与$scope.item = true类似，并且您将其用作ng-if="item"，则应将模型更改为$scope.myvalue = {}并使用如下所示：ng-if="myvalue.item"。意味着你应该使用ng-if的对象属性而不是简单的值