ui-router不会从抽象父级转换到子级状态

时间:2017-11-15 16:33:57

标签: javascript angularjs angular-ui-router

成功登录后,我应该从login状态转换为home状态。在home之前,或登录后可访问的应用程序中的任何其他状态之前,我想要触发一些resolve方法,确保在控制器之前加载特权/访问数据。为此,我使用了解决方案创建了一个抽象的父状态,并创建了除login个子状态以外的所有状态。

login控制器触发$state.go('home')时,会触发$stateChangeStart事件,但应用程序似乎在此之后消失。 $stateChangeSuccess永远不会触发,如果我单步执行代码,我只需在$stateChangeStart之后退出调试器。状态没有改变(我仍然在登录页面上)并且更好但没有错误消息。思考/希望我有一些简单的配置设置不当。

config.js

    $urlRouterProvider.otherwise('/home');
    $stateProvider
        .state('/', {
            templateUrl: 'app/components/home/home.html',
            controller: 'HomeController',
            controllerAs: 'vm',
            parent: 'app',
            authenticate: true,
            data:{
                rule: function($rootScope){
                    return true;
                }
            }                    
        })
        .state('login', {
            url: '/login',
            templateUrl: 'app/components/login/login.html',
            controller: 'LoginController',
            controllerAs: 'vm',
            reloadOnSearch: false,
            authenticate: false,
            params: {
                'passwordResetSuccess': ''
            }
        })
        .state('forgotPassword', {
            url: '/forgotPassword',
            templateUrl: 'app/components/login/forgotPassword.html',
            controller: 'ForgotPasswordController',
            controllerAs: 'vm',
            authenticate: false,
            params: {
                'username':''
            }
        })
        .state('app', {
            url:'',
            abstract: true,
            template: '<div ui-view class="slide-animation"></div>',
            resolve:{
                privilege: ['privilegesService', function(privilegesService){
                    return privilegesService.getPrivileges().then(privilegesService.privilegesData)
                                                            .catch(privilegesService.getPrivilegesError);
                }],
                alarms: ['alarmsService', function(alarmsService){
                    return alarmsService.setAlarms();
                }],
                firmsData: ['chosenFirmService', function(chosenFirmService){
                    return chosenFirmService.getFirmsData();
                }],
                notifications: ['notificationsService', function(notificationsService){
                    return notificationsService.setupGlobalAccess();
                }],
                releaseNotes: ['releaseNotesService, $rootScope', function(releaseNotesService, $rootScope){
                    $rootScope.loadNotificationData();
                    releaseNotesService.setupGlobalAccess(); 
                    return;
                }],
                setIdle: ['Idle', function(Idle){
                    Idle.watch();
                    Idle.setIdle(15*60);
                    return;
                }] 
            }
        })
        .state('home', {
            url: '/home',
            templateUrl: 'app/components/home/home.html',
            controller: 'HomeController',
            controllerAs: 'vm',
            parent: 'app',
            authenticate: true,
            data:{
                rule: function($rootScope){
                    return true;
                }
            }                   
        })

app.route.js

    $rootScope.$on("$stateChangeStart", function (event, toState, toParams, fromState, fromParams) {
        $('[data-toggle="popover"]').popover('hide');

        //////////////////
        //Check for auth key if missing redirect to login
        /////////////////
        if(toState.authenticate){
            if(authService.authKeyExists()){
                var authorized = toState.data ? toState.data.rule ? toState.data.rule($rootScope) : true : true;
                if(authorized){
                    if(toState.url.indexOf("/add") > -1){
                        $rootScope.selectedFirmId = null;
                    } else {
                        $rootScope.selectedFirmId = $rootScope.cachedFirmId;
                    }
                    var navigateFromString = fromState && fromState.name ? "Navigated from " + fromState.name + " to " : "Started from ";
                    navigationService.addNavObject("activity", {
                        summary : "Page navigation",
                        activity : navigateFromString + toState.name,
                        page : $location.absUrl().replace("#/", ""),
                        level : "debug"
                    });
                } else {
                    $state.go('home');
                }
            } else {
                event.preventDefault();
                $state.go('login');
            }   
        }
    });

    // Hack because ui-router doesn't save previous $state
    $rootScope.$on('$stateChangeSuccess', function(event, toState, toParams, fromState, fromParams){
        if(fromState.name){
            $state.lastKnownState = {};
            $state.lastKnownState.name = toState.name;
            $state.lastKnownState.params = toParams;
            $state.previousState = {};
            $state.previousState.name = fromState.name;
            $state.previousState.params = fromParams;
        }
    });

的index.html

<div class="slide-animation-container">
    <div ui-view id="ng-view" class="slide-animation"></div>
    {{scrollTo}}
</div>

1 个答案:

答案 0 :(得分:0)

这显然是由于在$rootScope决心中加入了releaseNotes。删除此依赖项允许加载应用程序。