0

我有一个用户可以登录的应用程序。登录后,视图分为 2 - 信息栏和主要部分。主要部分通过 ng-view 更新。未登录时,使用 ng-show 将信息栏从视图中隐藏,然后在登录后显示。目前,未登录时它会根据需要隐藏,但登录时不会显示。如果您查看下面的控制器,我希望成功登录loginStatus.loggedIn时等于用户名,因此真实,应该调用 ng-show。还是我弄错了?

代码简介:

索引.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>

应用程序.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;
        }
    }
};
}]);

控制器.js

userApp.controller( 'LoginStatus_control', function( $scope, $rootScope, $route, OAuth ) {
var user = OAuth.isLoggedIn();

$scope.loginStatus = {
    loggedIn: user
}
console.log($scope.loginStatus.loggedIn);
});

编辑

这是Plunker

4

0 回答 0