AngularJS [UI-Router] urlRouteProvider.when()与解析路由到子状态

时间:2013-12-09 21:48:05

标签: javascript angularjs angular-ui-router

在我的应用程序中,我有一个名为'dashboard'的状态,其中包含多个子状态

.state('dashboard', {
    url: '/dashboard',
    abstract: true,
    // resolve async objects before controller instantiation.
    resolve: {
        productResolve: function ($state, authService, cacheService, productService) {
            var cache = cacheService.getCache();
            if (cache.length === 0){
                return productService.getProductsAndCommoditiesAsync(authService.getCredentials().roleID)
                    .then(function(productData){
                        cacheService.setCache(productData);
                    },
                    function(errorMessage){
                        $state.go('error',{errorMessage:errorMessage});
                    });                         
            }               
       }
    },        
    templateUrl: '/static/app/partials/dashboard.html',
    controller: 'dashboardCtrl',
})
// parent state: dashboard
.state('dashboard.splash', {
    templateUrl: '/static/app/partials/dashboard.splash.html',
    controller: 'dashboard.splashCtrl'
})
// parent state: dashboard
.state('dashboard.podSelector', {    
    // params array can be used instead of url to populate $stateParams
    params: ['productIndex', 'commodityIndex'],
    templateUrl: '/static/app/partials/dashboard.pod-selector.html',           
    controller: 'dashboard.podSelectorCtrl'

用户将被重定向到哪个子状态取决于他/她的会话cookie,我很好奇适当的位置是重定向。

我能想到的一个选项是将父仪表板状态设置为不抽象,以便能够导航到,然后从仪表板父解析承诺中检查会话,并执行$ state.go到一个孩子取决于结果。理想情况下,我希望将仪表板父状态抽象保持为无用的,但如果它总是会重定向到子状态,那么我认为它不重要,如果它是。

我想到的替代方法是使用$ urlRouterProvider.when()来处理它,例如:

$urlRouterProvider.when('/dashboard', function($state, sessionService){
    if (sessionService.getSession() === undefined) {
        $state.go('dashboard.splash');
    }
}); 

这看起来更干净,更合乎逻辑,但是如果我从登录状态转换到仪表板状态,如果我在解析中重定向,我可以从登录页面转换为$ state.go ('仪表板')如果我使用$ urlRouterProvider我需要做一个$ location.path('/ dashboard'),我不知道有多少过渡到位置路径与$ state.go的状态是不赞成的。

任何建议都将不胜感激。

1 个答案:

答案 0 :(得分:1)

  

用户将被重定向到哪个子状态取决于他/她的会话cookie,我很好奇适当的位置是重定向。

一般情况下,如果您想根据应用状态或会话状态推送导航,我建议您使用服务拦截$ stateChangeStart事件并将它们发送到应有的位置。

那么,在您的应用的module.run回调中,您可以说:

$rootScope.$on('$stateChangeStart', function(event, toState) {
  if (toState.name === 'dashboard') {
    event.preventDefault();

    switch (myCondition) {
      case 1:
        $state.go('dashboard.splash');
        break;
      case 2:
        $state.go('dashboard.podSelector');
        break;
      default:
        $state.go('somewhereElse');
        break;
    }
  }
});

通过这种方式,你不会让过渡花费昂贵的时间和精力去一个你永远不打算继续留下的状态,而且你不依赖于$ urlRouter.when。