dom - 如果某些条件不应该加载指令？

Question

我有一个指令，但有时我不想加载它。

<div class="col-sm-12 panel panel-default" ng-if="DisplayName=='Automatic'">
    <div automatic-dir opt='opt'></div>
</div>

我试过了ng-if，ng-show好吧它没有显示，但我的指令都加载了。

Answer 1

如果您不想更改 DOM 结构，那么一种可能的方式就是这样，或者以最简单的方式之一，例如

<ul ng-controller="ListViewCtrl" >
   <li ng-repeat="item in items">
      <span>{{item.name}}</span>
      <div automatic-dir opt='opt' ng-if="item.hasMenu"></div>
   </li>
</ul>

如果您正在驾驶课程的自动目录，您应该能够做到这一点：

<ul ng-controller="ListViewCtrl" >
   <li ng-class="{'hasmenu': item.hasMenu}" ng-repeat="item in items">{{item.name}} </li>
</ul>

您能否具体说明使用 ng-if 完成它所面临的确切问题？一个 plunker 将是一个额外的优势，可以快速解决它。

您可以通过使用默认和/或条件行为构建指令来解决此问题，方法是将逻辑放入指令定义的链接或控制器中，或者您可以使用指令的ng-if将条件放入先前的 DOM 元素中。请注意，后一种方式不是 Angular 的最佳实践。