2013-08-16 27 views
5

Potrzebuję pomocy. Uczę się Angularjs i próbuję stworzyć usługę. Obecnie próbuję oddzielić wszystko w swoich modułach. Kiedy tworzę nowy moduł o nazwie (bac.route-manager) i próbuję wstrzyknąć go do konfiguracji aplikacji jako RouterService, pojawia się błąd, którego nie rozumiem i jak to naprawić. Wszystkie moje inne rzeczy wydają się działać, z wyjątkiem sytuacji, gdy próbowałem dodać ten moduł, ten nieznany dostawca zaczyna pojawiać się dopiero po tym, jak spróbuję go wstrzyknąć. Proszę o pomoc jest doceniana.angularjs Uncaught Błąd: Nieznany dostawca:

Mój błąd

Uncaught Error: Unknown provider: RouterService from bac 

Moi app.js złożyć

angular.module('bac', [ 
    'bac.route-manager' 
]) 

.config(function bacAppConfig($routeProvider, RouterService) { 

    //I dont knwo if i can do this but right now it doesnt matter because of error 
    console.log(RouterService.getRoutes()); 
}); 

My Route-manager.js plik

angular.module('bac.route-manager', []) 

.service('RouterService', function() { 

    this.getRoutes = function() { 
     return { 
       "/login": { 
      templateUrl: 'app/modules/login-manager/partials/login.tpl.html', 
      requiredLogin: false 
     }, 

     "/dashboard": { 
      templateUrl: 'app/modules/dashboard-manager/partials/dashboard.tpl.html', 
      controller: 'DashboardController', 
      requiredLogin: true 
     } 

     }; 

}; 

});

Używam pomruk do wygenerowania js w moim pliku html, ale tutaj jest to, jak to wygląda z dużą ilością usuniętych rzeczy dla zwięzłości.

Moja index.html

<html lang="en" class="no-js" ng-app="bac"> 
    <body> 
     <ng-view></ng-view> 

    <script type="text/javascript" src="vendor/angular/angular.js"></script> 
    <script type="text/javascript" src="app/app.js"></script> 
    <script type="text/javascript" src="app/modules/dashboard-manager/dashboard-manager.js"></script> 
    <script type="text/javascript" src="app/modules/route-manager/route-manager.js"></script> 

    </body> 
</html> 
+0

Spróbuj wczytać 'route-manager.js' przed' app.js' – AlwaysALearner

+0

Po prostu to wypróbowałem. Wygenerowałem plik index.html z pomrukiem, a następnie wszedłem i ręcznie przeniosłem plik route-manager.js ponad wszystko oprócz pliku app.js. Wciąż ten sam błąd. Uncaught Error: Nieznany dostawca: RouterService z bac – lumberjacked

+0

@Codezilla Faza konfiguracji i uruchamiania jest odroczona do momentu załadowania całego dokumentu. Kolejność, w jakiej się pojawiają, jest w tym przypadku nieistotna. –

Odpowiedz

17

W fazie config służby deklarowane nie są jeszcze dostępne. Tylko ci, którzy zostali zadeklarowani przy użyciu provide, będą przez serviceNameProvider (dodaj Provider po nazwie, którą zdefiniowałeś). Na przykład:

.provide('RouterService', function() { 
    var service = { }; 
    var routes = { 
    "/login": { 
     templateUrl: 'app/modules/login-manager/partials/login.tpl.html', 
     requiredLogin: false 
    }, 
    "/dashboard": { 
     templateUrl: 'app/modules/dashboard-manager/partials/dashboard.tpl.html', 
     controller: 'DashboardController', 
     requiredLogin: true 
    }}; 

    service.getRoutes = function() { return routes; }; 

    this.$get = function() { return service; } 

    this.setupRoute = function(data) { /* something here */ }; 
}; 

Gdy dojdziesz dostawcy, wszystkie metody zdefiniowane na this będzie dostępna. Kiedy uzyskujesz dostęp do normalnej usługi, wstrzyknięty jest zwrot funkcji $get. W zależności od tego, co trzeba, albo trzeba zmienić swoje usługi do wykorzystania provide lub poprosić o wstrzyknięto usługi w metodzie run:

angular.module('bac', ['bac.route-manager']) 
    .config(function ($routeProvider, RouterServiceProvider) { 
    // Here, only RouterServiceProvider.setupRoute will be available 
    }).run(function (RouterService) { 
    // Here, the service singleton return with the $get function will 
    // be injected 
    console.log(RouterService.getRoutes()); 
}); 

Edytuj

Na marginesie, uważam, że nawet jeśli zdefiniowaniu RouterService jako service domagając RouterServiceProvider będzie nadal działać, ale nie sposób będzie obecny jako service jest zasadniczo otoki wokół provider tylko powrót funkcji w $get

+0

Dzięki za odpowiedź. Zamierzam ponownie rozważyć, a następnie zaznaczę to jako odpowiedź. – lumberjacked

+0

Konwersja usługi na dostawcę działa. Ale jestem zdezorientowany, jak zaimplementować metodę $ get. Wewnątrz dostawcy dodałem metodę this.getRoutes(), aby móc następnie przepętlić obiekt, aby skonfigurować trasy w $ routeProvider.Naprawdę nie potrzebuję metody $ get na tym etapie, może później, ale nie mogę po prostu wprowadzić wtyczki RouterServiceProvider do kontrolera, aby użyć metody this.getRoutes(). – lumberjacked

Powiązane problemy