ユーザーがログインできるアプリケーションがあります。ビューにログインすると、インフォバーとメイン セクションの 2 つに分割されます。メイン セクションは ng-view 経由で更新されます。ログインしていない場合、情報バーは ng-show を使用してビューから非表示になり、ログインすると表示されます。ログインに成功loginStatus.loggedInすると、ユーザー名と同じになるため、真実であり、ng-show を呼び出す必要があります。それとも私はそれを間違っていますか？
簡単なコード：
index.html
<body ng-controller="LoginStatus_control" ng-cloak>
<div ng-show="loginStatus.loggedIn" class="infobar">
You are logged in as {{username}}
<button type="button" ng-click="logoutUser()">Logout</button>
</div>
<div class="main">
<div ng-view></div>
</div>
</body>
app.js
userApp.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
$routeProvider.
when('/angular-app/app/', {templateUrl: 'partials/login_part.html'}).
when('/angular-app/app/overview', {templateUrl: 'partials/overview_part.html', controller: 'Admin_control'}).
when('/angular-app/app/users', {templateUrl: 'partials/users_part.html', controller: 'Users_control'}).
otherwise({redirectTo: '/angular-app/app/'});
$locationProvider.html5Mode(true);
}]);
userApp.factory('OAuth', ['$http', '$location', function($http, $location) {
return {
login: function(rememberCheck, username) {
if( rememberCheck === true ) {
localStorage.loggedin = username;
} else {
sessionStorage.loggedin = username;
}
$location.path('/angular-app/app/overview');
},
logout: function() {
localStorage.loggedin = null;
sessionStorage.loggedin = null;
$location.path('/angular-app/app/');
},
isLoggedIn: function() {
if( (sessionStorage.loggedin !== 'null') || (localStorage.loggedin !== 'null') ) {
if( sessionStorage.loggedin ) {
return sessionStorage.loggedin;
}
else {
return localStorage.loggedin;
}
} else {
return false;
}
}
};
}]);
controllers.js
userApp.controller( 'LoginStatus_control', function( $scope, $rootScope, $route, OAuth ) {
var user = OAuth.isLoggedIn();
$scope.loginStatus = {
loggedIn: user
}
console.log($scope.loginStatus.loggedIn);
});
編集