ng-hide 没有触发，可能与 ng-view 有关？

Question

我有一个使用 angular 路由的 angular 网站。它有一个登录名，在该页面上我想隐藏 header。我在其他 Whosebug 页面上发现，执行此操作的最佳方法是使用 ng-if 或 ng-hide。但是这些似乎并没有触发。里面有一些荷兰语所以忽略那个

<nav ng-hide="isLogin()" class="navbar navbar-default">
  <div class="container-fluid">
    <div class="navbar-header"><a href="/" class="navbar-brand"><img alt="Brand" src="../resources/calendar.png"></a></div>
    <ul class="nav navbar-nav">
      <li><a href="./taken">Taken</a></li>
      <li><a href="./hulpaanvragers">Hulp aanvragers</a></li>
      <li><a href="./vrijwilligers">Vrijwilligers</a></li>
    </ul>
    <ul class="nav navbar-nav pull-right">
      <li><a href="./login" ng-click="logout()">logout</a></li>
    </ul>
  </div>
</nav>

$scope.isLogin = function(){
    console.log($location.path() == '/login');
    return $location.path() == '/login';
};

webpage 请注意控制台中没有打印任何内容（随机文本是其他内容），甚至很难在 isLogin() 函数 console.log() 中使用

isLogin() 函数位于 logincontroller 中，它在 app.config() 函数中为路由“/login”引用

Answer 1

这是一个pen，我建议做一些不同的事情。但是根据上面给出的代码，这是一种解决方法。超时仅用于示例目的，这可能是从登录响应 success/fail.

中设置的

angular.module('app', [])
  .controller('ExampleController', ExampleController);

ExampleController.$inject = ['$scope', '$timeout'];

function ExampleController($scope, $timeout) {
  $scope.hideNav = false;
  $scope.loggedIn = function() {
    //this could also be set in the view.
    $scope.hideNav = true;
  }

  $scope.logOut = function() {
    $scope.hideNav = false;
  }

  $scope.$watch('hideNav', function(newVal, oldVal) {
    if (newVal == true) {
      $timeout(function() {
        $scope.hideNav = false;
      }, 10000);
    }
  });

}

<div class="container" ng-app="app">
  <nav ng-hide="hideNav" class="navbar navbar-default" ng-controller="ExampleController">
    <div class="container-fluid">
      <div class="navbar-header">
        <a href="/" class="navbar-brand">
          <img alt="Brand" src="../resources/calendar.png">
        </a>
      </div>
      <ul class="nav navbar-nav">
        <li><a href="./taken">Taken</a>
        </li>
        <li><a href="./hulpaanvragers">Hulp aanvragers</a>
        </li>
        <li><a href="./vrijwilligers">Vrijwilligers</a>
        </li>
      </ul>
      <ul class="nav navbar-nav pull-right">
        <li><a href="#" ng-click="loggedIn()">log in</a>
        </li>
        <li><a href="#" ng-click="logOut()">logout</a>
        </li>
      </ul>
    </div>
  </nav>
</div>

Answer 2

我找到了 ng-hide 不工作的原因这是因为导航栏不是包含控制器

的 ng-view 的一部分

我不知道导航栏位于 ng-view

范围之外的事实

我通过添加一个包围整个 body

的额外控制器来修复它

编辑*

更改了解决方案，没有添加额外的控制器，而是将变量添加到 rootscope 并且 rootscope 可以访问整个页面

ng-hide 没有触发，可能与 ng-view 有关？

ng-hide not triggering, maybe something to do with ng-view?

angularjs

angular-ng-if

ng-hide