Angular UI-router:URL正在改变,但视图保持加载(预加载器)

时间:2016-08-22 17:41:36

标签: javascript angularjs angular-ui-router

我有一个问题,我无法弄清楚。我试图阻止未经过身份验证的用户访问我的网络应用。当我尝试访问受限页面(示例/配置文件)时,应用程序的URL更改为/ login但我的预加载器继续加载状态。当我硬刷新页面时,登录页面正确加载。

当我登录并手动删除我的令牌并通过点击链接更改状态时,ui-router会将我重定向到登录页面。

所以问题只发生在没有登录的用户尝试通过url访问webapp时(www.example.com/#/profile)。

我认为它有点小,但我真的不知道在哪里看......

App.states.js

.state("restricted", {
                abstract: true,
                url: "",
                templateUrl: 'app/views/restricted.html',
                resolve: {
                    deps: ['$ocLazyLoad', function ($ocLazyLoad) {
                        return $ocLazyLoad.load([
                            'lazy_uikit',
                            'lazy_selectizeJS',
                            'lazy_switchery',
                            'lazy_prismJS',
                            'lazy_autosize',
                            'lazy_iCheck',
                            'lazy_themes',
                            'sweetAlert'
                        ]);
                    }]
                },
                data: {
                    authenticationRequired: true
                }
            })

App.js

$rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams) {

           console.log(toState.data.authenticationRequired);

            if(toState.data.authenticationRequired){
                if(!AuthService.isAuthenticated()){
                    event.preventDefault();
                    $state.go('login');
                }
            }


            // main search
            $rootScope.mainSearchActive = false;
            // secondary sidebar
            $rootScope.sidebar_secondary = false;
            $rootScope.secondarySidebarHiddenLarge = false;
            // full header
            $rootScope.fullHeaderActive = true;
            // accordion mode in Menu
            $rootScope.menuAccordionMode = true;

            if($($window).width() < 1220 ) {
                // hide primary sidebar
                $rootScope.primarySidebarActive = false;
                $rootScope.hide_content_sidebar = false;
            }
            if(!toParams.hasOwnProperty('hidePreloader')) {
                $rootScope.pageLoading = true;
                $rootScope.pageLoaded = false;
            }

        });

1 个答案:

答案 0 :(得分:1)

我找到了解决方案,用

调整$ state.go(&#39; login&#39;)
$state.transitionTo('login', {}, { reload: true, inherit: true, notify: true});