路由后,Ng-show无法正常工作

时间:2014-10-23 16:41:44

标签: javascript angularjs authentication cookies

如果您在登录后从浏览器中删除cookie(令牌),则会出现隐藏导航的问题。因此您可以登录并显示导航但删除令牌后,只有在刷新浏览器时才会隐藏。如果你只是点击仪表板导航链接,它会将你回路“/”并显示home.html而不是dashboard.html,但它永远不会正确隐藏导航,即使javascript中有$ scope.navigation = false。

Scenario in Steps: 
1. Go to index.html with template home.html showing and login
2. Delete token from browser
3. Click on Dashboard nav link performAuthCheck is called from dashboard controller
4. performAuthCheck doesnt find cookie so page is routed "/"
5. Login Controller calls  $scope.authenticated = authService.tokenExists();
6. ng-show=authenticated doesnt hide navigation event though $scope.authenticated = false

它几乎像dom需要重新加载,因为一旦$ scope.authenticated = false,html就不知道了。任何帮助将不胜感激。

的index.html:

<div data-ng-show="authenticated">
                    <li class="nav navbar-nav">
                        <ul class="nav nav-pills">
                            <li data-ng-class="{'active':selectedTab === 'Dashboard'}" data-ng-click="selectedTab = 'Dashboard'"><a href="/Dashboard">Dashboard</a></li>
                            <li data-ng-class="{'active':selectedTab === 'Contacts'}" data-ng-click="selectedTab = 'Contacts'"><a href="/Contacts">Contacts</a></li>
                            <li data-ng-class="{'active':selectedTab === 'LeadSources'}" data-ng-click="selectedTab = 'LeadSources'"><a href="/LeadSources">Lead Sources</a></li>
                            <li data-ng-class="{'active':selectedTab === 'Admin'}" data-ng-click="selectedTab = 'Admin'"><a href="/Admin">Admin</a></li>
                        </ul>
                    </li>
                </div>

模块代码(app):

$routeProvider
    .when("/", {
        templateUrl: "/Templates/Home.html",
        controller: "lgLoginController"
    })
    .when("/Dashboard", {
        templateUrl: "/Templates/Dashboard.html"
    })
   ...

仪表板控制器:

app.controller('dbDashboardController', function($scope, authService) {
    authService.performAuthCheck();
});

Login Controller:

app.controller('lgLoginController', ['$scope', '$http', 'authService',
function ($scope, $http, authService) {

    $scope.authenticated = authService.tokenExists();

    $scope.login = function () {
        code to login...
    };
}]);

验证服务:

app.factory('authService', ['$http', '$q', '$cookieStore', '$location',
function ($http, $q, $cookieStore, $location) {

    return {

        tokenExists: function() {
            //Get cookie
            var tokenCookie = $cookieStore.get('_Token');

            if (tokenCookie === undefined) {
                return false;
            } else {
                return true;
            }
        },
        performAuthCheck: function () {
            //Get cookie
            var tokenCookie = $cookieStore.get('_Token');

            if (tokenCookie === undefined) {
                $location.url('/');
            }
        },
        loginService : function(username, password) {
            Post for logging in...
        }
    }
}]);

0 个答案:

没有答案