Angular JS:布尔值上的 ng 开关不起作用

Question

>我正在尝试根据存储在父作用域中的布尔值有条件地显示指令。我不知道为什么下面的不起作用。通过"不工作"，我的意思是两个指令都没有显示。

 <ul class="nav navbar-nav pull-right" ng-switch="userIsAuthenticated">
    <account-item item="accountMenuItem" ng-repeat="accountMenuItem in anonymousMenuItems" ng-switch-when="false"></account-item>
    <account-item item="accountMenuItem" ng-repeat="accountMenuItem in authenticatedMenuItems" ng-switch-when="true"></account-item>
</ul>

在我的测试用例中，即使认为"userIsAuthenticated"设置为"false"，也不会显示这两个指令。如果我在指令上方添加{{userIsAuthenticated}}则"false"将按预期输出。

我也试过这个：

 <ul class="nav navbar-nav pull-right" ng-switch={{userIsAuthenticated}}>
    <account-item item="accountMenuItem" ng-repeat="accountMenuItem in anonymousMenuItems" ng-switch-when={{false}}></account-item>
    <account-item item="accountMenuItem" ng-repeat="accountMenuItem in authenticatedMenuItems" ng-switch-when={{true}}></account-item>
</ul>

如果我从任何一个指令中删除条件 ng-switch-when 属性，它们将显示。所以我知道问题是我的ng开关。

Answer 1

你对ng-switch的使用在这个简化的演示中有效，当然没有你的account-item指令：http://plnkr.co/AppN8xmFeIwjaP631lj7

如果没有看到account-item的代码，很难猜测是什么干扰了它。 您可以考虑使用 ng-if 来处理显示一个项目或另一个项目。

<ul>
  <div ng-if="!userIsAuthenticated">Content when not authenticated</div>
  <div ng-if="userIsAuthenticated">Content when authenticated</div>
</ul>

更新还要确保绑定到对象属性，而不是原始布尔值。 喜欢：user. authenticated

Answer 2

由于ngSwitchWhen的优先级为 800，因此您需要为自定义指令设置更高的优先级（即 account-item），以便在由ngSwitchWhen指令处理之前对其进行编译。例如：

.directive('accountItem', function () {
    return {
        ...
        priority: 900,
        ...
    };
});