javascript - 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>

登录正常

这是我的 Controller

登录 Controller

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

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

注销 Controller

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

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

<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

您的等于比较不正确。

这是为 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>