如何使用Angular UI路由器解析所有状态的数据?

时间:2015-02-19 22:22:48

标签: javascript angularjs angular-ui-router

在我的应用程序中,每条路线都要求在渲染之前从我的API检索帐户数据。为此,我使用ngRoute执行以下操作:

$rootScope.$on('$routeChangeStart', function(event, next, current) {
    next.$$route.resolve = next.$$route.resolve || {};

    next.$$route.resolve.authorizationCheck = function() {
        return deferredAccountData.promise;
    };
});

因此,在每个路由之前,必须解析返回承诺的authorizationCheck resolve。这非常有效。

我现在转而使用UI路由器,我需要保留此功能。有哪些方法可以实现这一目标?

我能想到的一个选项是使用嵌套状态并让所有路由继承从父状态解析。虽然如果可能的话我宁愿不窝。还有其他选择吗?

2 个答案:

答案 0 :(得分:5)

您可以在父状态下为多个ui-router状态解析所需的数据。然后,子状态也会有这些数据。

$stateProvider
.state('app', {
  url: "/",
  resolve: {
    authorizationCheck: function() {
       // Do your API checks or whatever
    }
  }
})
.state('app.somepage', {
  url: "/somepage",
  templateUrl: "partials/some.page.html",
  controller: function($scope) {

  }
})

在服务中进行授权检查更有意义,因此您可能希望在主控制器中注入Auth服务,并在此基础上注入状态和可用性。

答案 1 :(得分:1)

这最终取决于您如何组织路由,因为您可以为每个子节点和父节点继承路由并提供resolve子句,但是您还可以使用stateChangestart stateChangeSuccess事件来执行类似的操作。如需进一步的帮助,请提供您的路线样本