AngularJS有條件地顯示應用頁面上導航欄登錄/註銷按鈕

main.jsp中AngularJS有條件地顯示應用頁面上導航欄登錄/註銷按鈕

<html> 
<body ng-app="myApp"> 

<div class="navbar"> 
    <a href="/order"> View Orders </a> 
    <a href="/logout" ng-show="$scope.isUserLoggedIn"> Logout </label> 
    <a href="/login" ng-show="!$scope.isUserLoggedIn"> Login </label>  
</div> 
<div ng-view></div> 
</body> 
</html>

控制器

var myApp = angular.module('myApp', ['ngRoute']); 
...  
      // route for the default home page 
      .when('/', { 
       templateUrl : function($node, tattrs) { 
         return "resources/html/home.html"; 
       }, 
       controller : 'mainController' 
      }) 


      // route for the order page 
      .when('/order', { 
       templateUrl : function($node, tattrs) { 
         return "resources/html/order.html"; 
       }, 
       controller : 'orderController' 
      })

....

myApp.controller('mainController', function($scope, $http) { 
    .... 
    $scope.isUserLoggedIn = true; //or false 
.....

問題：
$ scope.isUserLoggedIn對Login/Logout hrefs沒有任何影響。主應用程序頁面上可能無法訪問該作用域（即在ng-app頁面的導航欄中）。

我想顯示隱藏登錄/註銷按鈕的條件。有任何想法嗎？

來源

2014-09-27 Jasper

在配置路由，請指定'mainController'到'NG-view' DIV，這就是爲什麼navbar div無法使用它。 – Patrick 2014-09-27 07:38:25

hello Patrick>所以在這裏ng-view被分配給mainController（與任何其他）在這裏..至少不是明確的..是它becz mainConroller是「/」路線？ – Jasper 2014-09-27 07:44:10

..當你配置路由..'.when（'/'，{controller：'mainController'}'我只是想強調你的代碼幾乎完成，但mainController可能沒有你想到的地方這就是爲什麼你需要ng控制器指令 – Patrick 2014-09-27 07:47:24

你缺少分配controller到div

沒必要用$scope那裏，只是用

<div class="navbar" ng-controller="mainController"> 
    <a href="/order"> View Orders </a> 
    <a href="/logout" ng-show="isUserLoggedIn"> Logout </label> 
    <a href="/login" ng-show="!isUserLoggedIn"> Login </label>  
</div>

來源

2014-09-27 07:15:32

我很努力做到這一點，並執行了很多事情，可能也是這個解決方案..但它對我來說這次工作!!!!!! – 2017-02-01 06:03:34

AngularJS有條件地顯示應用頁面上導航欄登錄/註銷按鈕

回答

相關問題