当在ui-router中使用解析时,是否有可能在其他状态解析开始之前先解析(例如身份验证检查)?
这是我现在如何做我的身份验证检查的一个例子:
angular.module('Example', [
'ui.router',
'services.auth',
'services.api'
])
.config(['$stateProvider', function ($stateProvider) {
$stateProvider.state('order', {
url: '/order',
views: {
'main': {
templateUrl: 'order/order.tpl.html',
controller: 'OrderCtrl'
}
},
resolve: {
// I want this one to resolve before any of the others even start.
loggedIn: ['auth', function (auth) {
return auth.loggedIn();
}],
cards: ['api', function (api) {
return api.getCards();
}],
shippingAddresses: ['api', function (api) {
return api.getShippingAddresses();
}]
}
});
}]);
我希望loggedIn
在cards
和shippingAddresses
开始之前先解决。
我可以把其他API调用放在控制器中(这就是它们之前的位置),但我希望从它们中检索到的数据在模板开始呈现之前可用。
这可能工作,但我不能注入每个单独的API调用的解析值。
...
resolve: {
// I want this one to resolve before any of the others even start.
loggedIn: ['auth', 'api', function (auth, api) {
return auth.loggedIn()
.then(api.getCards())
.then(api.getShippingAddresses())
.then(function () {
// whatever....
});
}]
}
...
编辑:看起来这里的答案解决了我的问题,也许这不是解决这个问题的最好方法,但它有效。
只需注入身份验证检查的解析值,它将等待,直到它被解析,然后继续进行其他解析。
...
resolve: {
// I want this one to resolve before any of the others even start.
loggedIn: ['auth', function (auth) {
return auth.loggedIn();
}],
cards: ['api', 'loggedIn', function (api, loggedIn) {
return api.getCards();
}],
shippingAddresses: ['api', 'loggedIn', function (api, loggedIn) {
return api.getShippingAddresses();
}]
}
...
我想自己回答这个问题,但我将留给其他人提供他们的解决方案。
我已经提供了一些关于如何将承诺组合在一起的概念证明:http://jsfiddle.net/pP7Uh/1/任何拒绝将阻止调用下一个then
方法
resolve: {
data: function (api) {
var state;
return api.loggedIn().then(function(loggedIn) {
state = loggedIn
return api.getCards();
}).then(function(getCards) {
return {
loggedIn: state,
getCards: getCards
}
}).catch(function(error) {
console.error('error', error)
});
}
}
在数据解析对象之后,您将有:
{
loggedIn:"calling loggedIn",
getCards:"calling getCards"
}