ui-router 在解决 parent 状态之前触发 child 状态

Question

我正在尝试在 Angular ui-router 的 parent 状态下执行一些初始化代码。初始化代码是 orderService.getStoreInfo() 其中 returns 一个承诺。只有当这个承诺被解决时，我才想触发 child 状态。但是，我注意到 child 状态甚至在 parent 的承诺解决之前就被触发了。我究竟做错了什么？这是我的代码：

function configure($stateProvider, $urlRouterProvider) {

    $urlRouterProvider.otherwise('/');

    $stateProvider
        .state('home', {
            abstract: true,
            template: '<ui-view/>',
            resolve: {
                storeInfo: /* @ngInject */ function(orderService) {
                    console.log('home: resolve - orderService.getStoreInfo()');
                    return orderService.getStoreInfo();
                }
            }
        })

        .state('home.orders', {
            url: '^/',
            template: '<my-order-list data-orders="vm.orders"></my-order-list>',
            resolve: {
                orders: /* @ngInject */ function (orderService) {
                    console.log('home.orders: resolve - orderService.getOrders()');
                    return orderService.getOrders();
                }
            },
            controller: ['orders', function (orders) {
                this.orders = orders;
            }],
            controllerAs: 'vm',
        });
}

控制台日志如下：

home: resolve - orderService.getStoreInfo()
home.orders: resolve - orderService.getOrders()
... messages from orderService.getStoreInfo() ...

这清楚地表明 child 状态甚至在 parent 状态被解决之前就开始了。

Answer 1

答案是here：如果您想在实例化子状态之前等待承诺被解析，则必须将resolve 键注入子状态。所以只需将 storeInfo 显式注入子状态的解析函数即可。

ui-router 在解决 parent 状态之前触发 child 状态

ui-router triggers child state before parent state is resolved

angularjs

angular-ui-router