Question

我正在使用ng-switch，如下所示。这是ng-switch的正确用法吗？我不希望它在数组中，因为我正在使用范围变量。

在我的HTML中，我已将其定义如下。 userRole是我希望我的搜索基于的变量，并且when我根据我的div标签内容应该使用的值使用了值。

<div ng-switch on ="userRole">
  <div ng-switch-when="admin">
     [...]
  </div>
  <div ng-switch-when="user">
     [...]
  </div>

我无法访问ng-switch的功能，而我的整个内容部分都消失了。

在我的.js文件中，我定义了以下内容：

if(loginModel.authorities[0].authority=="ROLE_ADMIN"){
  console.log("Me here");
  $scope.userRole="admin";
}
else
if(loginModel.authorities[0].authority=="ROLE_USER"){
  $scope.userRole="user";

}
else{
  $scope.userRole="guest";
}

但我的屏幕没有显示任何内容，这让我想知道我应该如何使用ng-switch。我不想使用ng-hide / ng-show。

Answer 1

这是一个简洁的小提琴，我发现ng-switch如何工作....你使用ng-switch的方式是完全有效的。我猜你的userRole没有让它失败的价值，你可以仔细检查一下。

<div ng-controller="LoginCheckCtrl">
   <div ng-switch on="loginData"> 
      <div ng-switch-when="false" ng-include="'login'"></div>
      <div ng-switch-when="true" ng-include="'logout'"></div>
   </div>
</div>

<script type="text/ng-template" id="login">
    <button ng-click="login()">Login</button>
</script>

<script type="text/ng-template" id="logout">
    <button ng-click="logout()">Logout</button>
</script>

控制器代码：

var app = angular.module('myApp', []);

function LoginCheckCtrl($scope) {
    $scope.loginData = false
    $scope.login = function() {
        console.log($scope.loginData  ? 'logged in' : 'not logged in');
        $scope.loginData = true;
    };
    $scope.logout = function() {
        console.log($scope.loginData ? 'logged in' : 'not logged in');
        $scope.loginData = false;
    };
}

小提琴 https://jsfiddle.net/mrajcok/jNxyE/

Ng开关不工作

1 个答案: