Kontrolowanie kolejności wykonywania w angularjs

Question

Odziedziczyłem aplikację kątową i teraz muszę wprowadzić zmianę.

W ramach tej zmiany niektóre dane muszą zostać ustawione w jednym kontrolerze, a następnie używane od innego. Stworzyłem więc usługę i jeden kontroler zapisał do niej dane, a jeden kontroler odczytał z niej dane.

angular.module('appRoot.controllers') 

.controller('pageController', function (myApiService, myService) { 
    // load data from API call 
    var data = myApiService.getData(); 

    // Write data into service 
    myService.addData(data); 
}) 

.controller('pageSubController', function (myService) { 
    // Read data from service 
    var data = myService.getData(); 

    // Do something with data.... 
}) 

Jednak, kiedy idę do korzystania data w pageSubController zawsze jest niezdefiniowany.

Jak mogę się upewnić, że pageController wykonuje się przed pageSubController? Czy jest to nawet właściwe pytanie?

EDIT

Moje kod usługi:

angular.module('appRoot.factories') 

.factory('myService', function() { 
    var data = []; 

    var addData = function (d) { 
     data = d; 
    }; 

    var getData = function() { 
     return data; 
    }; 

    return { 
     addData: addData, 
     getData: getData 
    }; 
}) 

Answer 1

Jeśli chcesz, aby kontroler czekał aż otrzymasz odpowiedź od drugiego kontrolera. Możesz spróbować użyć opcji $broadcast w angularjs.

W pageklerze należy nadać komunikat "dataAdded", a w kontrolerze stron trzeba poczekać na komunikat za pomocą $ scope. $ On, a następnie przetworzyć funkcję "getData".

Można spróbować czegoś takiego:

angular.module('appRoot.controllers') 
.controller('pageController', function (myApiService, myService,$rootScope) { 
    // load data from API call 
    var data = myApiService.getData(); 

    // Write data into service 
    myService.addData(data); 
    $rootScope.$broadcast('dataAdded', data); 
}) 

.controller('pageSubController', function (myService,$rootScope) { 
    // Read data from service 
    $scope.$on('dataAdded', function(event, data) { 
     var data = myService.getData(); 
    } 

    // Do something with data.... 
}) 

Answer 2

chciałbym zmienić swoje usługi, aby powrócić obietnicę dla danych. Na pytanie, jeśli dane nie zostały ustawione, po prostu zwróć obietnicę. Później, gdy drugi kontroler ustawi dane, rozwiąż poprzednie obietnice danymi. Użyłem tego wzorca do obsługi wyników API buforowania w taki sposób, że kontrolery nie wiedzą lub nie przejmują się, czy pobrałem dane z API, czy tylko zwróciłem dane z pamięci podręcznej. Coś podobnego do tego, chociaż być może trzeba zachować szereg oczekujących obietnic, które muszą zostać rozwiązane, gdy dane rzeczywiście zostaną ustawione.

function MyService($http, $q, $timeout) { 
    var factory = {}; 
    factory.get = function getItem(itemId) { 
    if (!itemId) { 
     throw new Error('itemId is required for MyService.get'); 
    } 
    var deferred = $q.defer(); 
    if (factory.item && factory.item._id === itemId) { 
     $timeout(function() { 
     deferred.resolve(factory.item); 
     }, 0); 
    } else { 
     $http.get('/api/items/' + itemId).then(function (resp) { 
     factory.item = resp.data; 
     deferred.resolve(factory.item); 
     }); 
    } 
    return deferred.promise; 
    }; 

    return factory; 
}