Il router UI attiva lo stato figlio prima che venga risolto lo stato genitore

Question

Sto tentando di eseguire un codice di inizializzazione in uno stato padre del router angolare. Il codice di inizializzazione è orderService.getStoreInfo() che restituisce una promessa. Solo quando questa promessa è risolta, voglio attivare lo stato figlio. Tuttavia, quello che sto notando è che lo stato infantile viene attivato anche prima che la promessa del genitore sia stata risolta. Che cosa sto facendo di sbagliato? Ecco il mio codice:

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', 
     }); 
} 

Il log della console è il seguente:

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

Ciò dimostra chiaramente che lo stato bambino sta sparando prima ancora che lo Stato genitore è stato risolto.

Answer 1

La risposta è here: le chiavi resolve DEVONO essere iniettate negli stati figlio se si desidera attendere la risoluzione delle promesse prima di istanziare i bambini. Quindi, solo in modo esplicito iniettare storeInfo in una funzione di risoluzione dello stato figlio.