在模板中使用ng-if的angularjs指令

Question

我正在构建一个使用ng-if内部模板的指令。奇怪的是，提供给link函数的元素没有展开ng-if代码，它只是ng-if的注释行。到处玩，我发现通过将我的链接代码包装在$ timeout中似乎可以使它工作，但我想知道这是不是正确的方法来实现它......更多的是，为什么会发生这种情况。

我添加了一个插件来演示：http://plnkr.co/edit/Gl7v8yJLevi664nUKcFY?p=preview

Answer 1

大多数指令实际上在$ watch（）中执行了大部分逻辑。例如，ng-if将在其属性上设置监视，然后在更改时渲染/删除dom。手表在摘要周期中执行，因此即使已经编译和链接了指令，手表还没有运行以确定它是否应该显示if。

修改

您应该考虑一下您实际在做什么，以确定它是否是您想要的。请注意，ng-if是动态的。因此，根据items数组是否为空，它可能随时被删除或添加。

这意味着即使你设法推迟你的dom操作直到if呈现之后，你也会冒险离开并返回（此时你的css代码不会再次运行）。

更好的方法是设置手表并将css添加到手表中，或者更好的是，使用ng-class并在模板中添加css。

Answer 2

角度框架需要调用$scope.$apply()才能更新绑定并扩展模板。 $timeout()是一个异步包装器，它假设在角度世界之外进行了更改，并将$scope.$apply()作为最后一步调用。在您的情况下，直接使用$scope.$apply();，在您的元素调用达到预期效果之前。