2013-02-20 13 views
20

Mój styl pisania kątowych kontrolerów jest tak (używając nazwy sterownika zamiast funkcji)angularjs rozwiązać ze sterownikiem jako ciąg

angular.module('mymodule', [ 
]) 
    .controller('myController', [ 
     '$scope', 
     function($scope) { 
      // Some code here 

     } 
    ]); 

Co muszę teraz jest przy świadczeniu I tras chcę definiować rolę resolve:

$routeProvider.when('/someroute', { 
     templateUrl: 'partials/someroute.html', 
     resolve: myController.resolve}) // THIS IS THE CRITICAL LINE 

Ponieważ kontroler jest zdefiniowany jako nazwa sposobu rozwiązania części poniżej?

Aby dokładniej wyjaśnić szczegóły Chcę załadować niektóre dane z serwera przed rozstrzygnięciem trasy, a następnie użyć tych danych w kontrolerze.

AKTUALIZACJA: Dokładniej chcę, aby każdy moduł miał swoją "rozstrzygającą" funkcję, która zostanie wywołana przed rootem z tym kontrolerem. Rozwiązanie w this post (odpowiedź Misko Hevery) robi dokładnie to, czego chcę, ale nie mam kontrolerów jako funkcji, ale jako nazwy.

Odpowiedz

23

Definicję kontrolera i części zamienne należy określić oddzielnie w definicji trasy.

Jeśli zdefiniujemy kontrolerów na poziomie modułu trzeba odwoływać się do nich jako ciąg, więc:

$routeProvider.when('/someroute', { 
     templateUrl: 'partials/someroute.html', 
     controller: 'myController', 
     resolve: { 
      myVar: function(){ 
      //code to be executed before route change goes here 
      }; 
     }); 

Powyższy kod pokazuje również, w jaki sposób zdefiniować zestaw zmiennych, które zostaną rozwiązane przed zmianą trasy. Kiedy rozwiązać te zmienne mogą być wstrzykiwane do kontrolera więc biorąc przykład z urywek powyżej możesz napisać kontroler tak:

.controller('myController', ['$scope', 'myVar', function($scope, myVar) { 
      // myVar is already resolved and injected here 
     } 
    ]); 

Ten film może pomóc także: http://www.youtube.com/watch?v=P6KITGRQujQ

+0

mogę korzystać z usług, za? –

+0

@AndrejKaurin możesz wprowadzić usługi do kontrolera i rozwiązać funkcje, jeśli o to pytasz ... Czy możesz być bardziej precyzyjny? –

+0

Zaktualizowałem moje pytanie, aby było bardziej precyzyjne. –

14

@ pkozlowski.opensource ' Odpowiedź s działa, ale tak naprawdę nie chcę zepsuć mojego routingu i kontrolerów, ponieważ zawsze trzymam go w separacji (z Yo Generatora). Właściwie możemy również mieć kontroler i rozstrzygać (r) wszystko jako string/name (funkcja NOT).

angular.module('mymodule', [ 
]) 
    .controller('myController', [ 
     '$scope', 'myModelCombination' 
     function($scope, myModelCombination) { 
      // myModelCombination[0] === (resolved) myModel 
      // myModelCombination[1] === (resolved) myModel2 

     } 
    ]) 
    .controller('myController2', [ 
     '$scope', 'myModel' 
     function($scope, myModel) { 
      // Some code here 

     } 
    ]) 
    .factory('myModel', [ 
     '$scope', 
     function($scope) { 
      // return a promise 

     } 
    ]) 
    .factory('myModel2', [ 
     '$scope', 
     function($scope) { 
      // return a promise 

     } 
    ]) 
    .factory('myModelCombination', [ 
     '$scope', 'myModel', 'myModel2' 
     function($scope) { 
      return $q.all(['myModel', 'myModel2']); 

     } 
    ]); 

Następnie w pliku routingu tego należy dodać

$routeProvider.when('/someroute', { 
    templateUrl: 'partials/someroute.html', 
    resolve: ['myModel'] //ALWAYS IN ARRAY) 
}); 
$routeProvider.when('/myModelCombination', { 
    templateUrl: 'partials/someroute2.html', 
    resolve: ['myModel'] //ALWAYS IN ARRAY) 
}); 

http://docs.angularjs.org/api/ng. $ RouteProvider

+2

fabryka myModel powinna zwrócić obietnicę? Jak zwrócić więcej obietnic za pośrednictwem jednej fabryki (myModel w tym przypadku)? Albo powinienem stworzyć nową fabrykę dla każdego rozwiązania. –

+1

Tak, każda fabryka powinna zwrócić jedną i tylko jedną rzecz, wartość lub obietnicę, chyba że chcesz poczekać na wszystko i zwrócić wszystko w $ q.all(). Odpowiedź edytowana. – TruongSinh

+0

To nie działa. Czy możesz pokazać skrzypce? – sh0ber

0

@TruongSinh odpowiedź pracował dla mnie i jest sposób ładniejszy niż o dodatkowe funkcje w routerze. Poprawiłem go trochę, ponieważ zwracał odroczony obiekt zamiast rzeczywistych danych rozwiązanych.

$routeProvider.when('/someroute', { 
    templateUrl: 'partials/someroute.html', 
    controller: 'SomeController', 
    resolve: { 
     myModel: 'myModel' 
    } 
}); 
+3

Czy byłoby możliwe umieszczenie tutaj całego rozwiązania? Próbuję zrobić to samo (zwracając odroczony obiekt po rozwiązaniu) i mając trudności z uruchomieniem go. Dzięki. – Pinny

0

to będzie działać zbyt

var MyController = myApp.controller('MyController', ['$scope', 'myData', function($scope, myData) { 
    // Some code here 
}]); 

MyController.resolve = { 
    myData: ['$http', '$q', function($http, $q) { 
    var defer = $q.defer(); 

    $http.get('/foo/bar') 
     .success(function(data) { 
     defer.resolve(data); 
     }) 
     .error(function(error, status) { 
     defer.reject(error); 
     }); 

    return defer.promise; 
    }] 
}; 
Powiązane problemy