2013-03-12 15 views
7

Mam niektóre dane, które są przetwarzane asynchronicznie w tle i chcą opóźnić inicjalizację całej aplikacji Angular, aż do jej zakończenia.Delay Angular App Initialization

BackgroundData.initialized jest obietnica Q, więc coś takiego:

BackgroundData.initialized.then(AngularDoYoStuff) 

Problem napotkasz jest kontroler stronie głównej rozpoczyna swoją procedurę inicjalizacji, uderza BackgroundData i albo ma zły/brak danych .

Jaką funkcję mogę włączyć do inicjowania Angulara, aby zamiast czekać tylko na dom, czekał na domową i inicjalizacyjną identyfikację tła?

UPDATE

Dostałem bliżej z dokumentacją na manual bootstrapping:

angular.element(document).ready -> 
    setupGA() 
    window.BackgroundData = new DataMachine() 
    BackgroundData.initialized.then -> 
    angular.bootstrap(document) 

Ale gdy obciążenie pliki kontrolera (po tym pliku), są one nadal uzyskiwanie zainicjowany przed BackgroundData definiuje

UPDATE 2

Usuwanie dyrektywy w HTML ng-app Wydaje się, że problem został rozwiązany (ponieważ mówił kątowa do automatycznej inicjalizacji), ale teraz po prostu ignoruje wszystkie moje angular.module połączeń

+0

dlaczego nie użyć resolve propery z kontrolerem –

+0

[kątowa - asynchronicznie bootstrap] (http://www.codeducky.org/angular-bootstrap-asynchronously) wyjaśnia, w jaki sposób można opóźnić inicjalizację aplikacji, dopóki nie załadujesz danych z serwera. –

Odpowiedz

9

Problemem było to, że zostawiła dyrektywę ng-app w znaczniku HTML, który nakazuje Angularowi automatyczne zainicjowanie tego zakresu. Usunięcie go umożliwiło prawidłowe uruchomienie mojej ręcznej inicjalizacji.

0

Jednym ze sposobów podejścia do tego, jeśli używasz tras w aplikacji, jest inicjalizacja aplikacji, ale czekaj na definiowanie tras, dopóki dane nie będą dostępne.

tj. dostarczać przyjazny dla użytkownika komunikat "ładowanie", a następnie ładować funkcjonalność po.

Jesteś w stanie wstrzyknąć $route w razie potrzeby, a następnie wywołać coś takiego:

$route.routes["/RouteName/:param"] = {templateUrl:"template.html", reloadOnSearch:true, controller:"ControllerName"}; 

potem zadzwonić $route.reload() lub $rootScope.apply() aby odświeżyć.

Więcej informacji na https://groups.google.com/forum/?fromgroups=#!msg/angular/AokZpUhZ6mw/x2kPIN2VAC0J

+0

Wygląda na to, że trasy są ładowane - stworzyłem MainController, który od razu wywołuje funkcję $ route.reload(). Logowanie $ route.routes, widzę poprawne trasy, ale $ location.path() jest puste, więc nie pasuje do niczego – Chris

+0

i potwierdziłem, że nie ma pojęcia, jaką ścieżkę wyrenderować przez dodanie "else" do $ routeProvider. – Chris

0

jak Chris wspomniano, można to zrobić z angular.bootstrap i nie wspomnieć o NG-app:

<div id="appArea" ng-controller="someCtrl"> 
    {{name}} 
</div> 

    <script> 
    angular.module('someApp', []) 
    .controller('someCtrl', function($scope) { 
     $scope.name = "test name"; 
    }) 
    setTimeout(function() { 
     angular.bootstrap(document, ['someApp']); 
    }, 2000); 
    </script>