1

在 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();
    }]
}
...

我会自己回答这个问题，但我会让其他人提供他们的解决方案。

4

1 回答 1

0

我提供了一些概念证明如何将 Promise 组合在一起：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"
 }
于 2014-06-13T23:47:18.193 回答