AngularJS ng-show 和 ng-hide 不起作用

Question

这里的 angularjs 逻辑有问题

我只想在没有用户登录的情况下显示登录链接，并且只显示登录用户的注销链接，但它不能正常工作

我的 HTML

 <section ng-controller="a" ng-show="auth = false">
    <a href="#/signin" ng-click="signin()"> Sign in </a>
 </section>

 <section ng-controller="b" ng-show="auth = true">
    <a href="#/signout" ng-click="signout()"> Sign out </a>
 </section>

登录正常

这是我的控制器

登录控制器

 function ($scope, Service){
 $scope.auth = true;
 $scope.signin = function($event, userID, passwd){ 

                 Service.signin(userID,passwd).then( 
                        function (response){
                            $scope.auth = true; 
                  });
 }]).

注销控制器

  function ($scope, Service){
  $scope.auth = false; 
  $scope.signout = function($event){ 
                 Service.signout().then( 
                        function (response){
                            $scope.auth = false;    
                  });
  }]).

这两个注销和登录链接基本上都在我的主页中。我不想创建很多页面，因此我想互相隐藏。当用户单击登录链接时，它将运行 angularjs 路由器，在这种情况下是 /login，表单还有另一个 templateURL，它将直接附加到主页。一旦用户输入了用户名和密码，用户需要点击提交按钮，这是代码

<form role="form" name="form1">
    <label for"userID">UserID</label><input type="text" id="userID" ng-model="userID">
    <label for"passwd">Password</label><input type="text" id="passwd" ng-model="passwd">
    <button data-ng-click="signin($event,userID,passwd); reload()">Login</button>

reload() 函数会直接刷新页面。我正在使用 $window.location.reload()

Answer 1

你的equals比较不正确。

这是为 auth 分配一个 false 值：

ng-show="auth = false"

你想要的是这个（双等​​号和三等号比较）

ng-show="auth === false"

您也可以这样做：

<section ng-controller="a" ng-show="!auth">
    <a href="#/signin" ng-click="signin()"> Sign in </a>
 </section>

 <section ng-controller="b" ng-show="auth">
    <a href="#/signout" ng-click="signout()"> Sign out </a>
 </section>

Answer 2

实际上你需要两个作品来完成这个任务

第一个作品：-

您需要在$rootScope 而不是$scope 中分配auth 变量。 因为这个对象用在两个控制器中。

喜欢

function ($scope, dataService, $rootScope){
 $scope.auth = true;
 $scope.signin = function($event, userID, passwd){ 

                 Service.signin(userID,passwd).then( 
                        function (response){
                            $rootScope.auth = true; 
                  });
 }]).

第二个工作：

您需要将ng-show="auth = false" 更改为ng-show="auth === false"。您已经使用了单等号。 应该是 double 或 triple 相等

或

如果您在 $rootScope 中分配了对象，那么您不需要检查元素中的条件是真还是假。因为您已经在控制器中定义 auth 为 false 或 true。所以你只能打电话给ng-show="auth。

Answer 3

试试下面的

ng-show="auth"

请让我知道它是否仍然无法正常工作..