你能把ng-switch和ng-if一起用吗?

Can you use ng-switch and ng-if together?

本文关键字：一起 ng-if ng-switch      更新时间：2023-09-26

我试图同时使用角ng-switch和ng-if指令，但它似乎不工作。我所做的是:

<div data-ng-if = "x === 'someValue'" data-ng-switch on = "booleanValue">
   <div data-ng-switch-when = "!booleanValue" data-ng-include="'partial/index.html'"></div>
   <div data-ng-switch-when = "booleanValue" data-ng-include="'partial/pageTwo.html'"></div>
</div>

我只是想知道这是否可能，或者是否有一种替代方法可以根据$作用域中的某些条件来切换这些部分?

在你的ng-switch-when，使用true和false代替booleanValue和!booleanValue:

<div data-ng-if = "x === 'someValue'" data-ng-switch on = "booleanValue">
   <div data-ng-switch-when = "false" data-ng-include="'partial/index.html'"></div>
   <div data-ng-switch-when = "true" data-ng-include="'partial/pageTwo.html'"></div>
</div>

也可以使用ng-show:

<div data-ng-if = "x === 'someValue'" >
   <div data-ng-show = "!booleanValue" data-ng-include="'partial/index.html'"></div>
   <div data-ng-show = "booleanValue" data-ng-include="'partial/pageTwo.html'"></div>
</div>

或者再次使用ng-if:

<div data-ng-if = "x === 'someValue'" >
   <div data-ng-if = "!booleanValue" data-ng-include="'partial/index.html'"></div>
   <div data-ng-if = "booleanValue" data-ng-include="'partial/pageTwo.html'"></div>
</div>


ng-if更接近ng-switch，因为它们实际上都是从DOM中分离和重新附加html片段。ng-show只是切换片段的可见性，而不从DOM中删除它。

相关文章：