Angularjs ui路由器拒绝解决如何避免加载模板

时间:2014-06-21 15:17:30

标签: angularjs angular-ui-router

我已获得此代码

//Setting up route
angular.module('my')
    .config(['$stateProvider',function($stateProvider) {
        //  Check if the user is just logged
        var checkLoggedOut = function($http) {
            /* if the user is just logged the server send a Forbidden status 403*/
            return $http.get('/loggedout');
        };
        //  Check if the user is logged
        var checkLoggedIn = function($http) {
            return $http.get('/loggedin');
        };

        // states for my app
        $stateProvider
            .state('user', {
                abstract: true,
                templateUrl: 'users/views/index.html',
                resolve: {
                    loggedin: checkLoggedIn
                }
            })
            .state('user_register', {
                url: '/user/register',
                templateUrl: 'users/views/register.html',
                resolve: {
                    loggedin: checkLoggedOut
                },
                controller:'UserRegisterCtrl'
            });
    }
    ]);

如果用户刚刚登录,则无法进入状态user_register

但模板仍然已加载。

这是通缉行为吗?

有没有办法避免它?

更新

可能是我的问题可能是误会

我想知道是否有办法避免模板加载如果解析被拒绝我的意思是所有为什么在解决方案被拒绝的时候加载模板imo如果解析失败模板不应该加载

结束

.factory('httpInterceptor', ['$q','$location',function ($q, $location) {
        return {
            'response': function(response) {
                if (response.status === 401) {
                    $location.path('/signin');
                    return $q.reject(response);
                }
                if (response.status === 403) {
                    $location.path('/');
                    return $q.reject(response);
                }
                return response || $q.when(response);
            },
            'responseError': function(rejection) {
                if (rejection.status === 401) {
                    $location.path('/signin');
                    return $q.reject(rejection);
                }
                if (rejection.status === 403) {
                    $location.path('/');
                    return $q.reject(rejection);
                }
                return $q.reject(rejection);
            }

        };
    }

2 个答案:

答案 0 :(得分:0)

首先,进行REST调用以检查用户是否以每次状态转换登录可能都很昂贵。将用户的状态存储在浏览器中可能更好。

其次,您要问的问题更多:您可以创建一个事件处理程序来侦听$ stateChangeStart事件。在此处理程序中,您可以检查用户是否已登录以及他们是否能够访问该状态。

此链接应有助于http://www.frederiknakstad.com/2014/02/09/ui-router-in-angular-client-side-auth/

答案 1 :(得分:-1)

您的checkLoggedIn函数必须管理用户未经过身份验证的情况。它可以使用$ state.go()或$ location将其重定向到相应的状态。