Ich möchte einen Dienst in app.config einfügen, damit Daten abgerufen werden können, bevor der Controller aufgerufen wird. Ich habe es so versucht:

Bedienung:

app.service('dbService', function() {
    return {
        getData: function($q, $http) {
            var defer = $q.defer();
            $http.get('db.php/score/getData').success(function(data) {
                defer.resolve(data);            
            });
            return defer.promise;
        }
    };
});

Konfiguration:

app.config(function ($routeProvider, dbService) {
    $routeProvider
        .when('/',
        {
            templateUrl: "partials/editor.html",
            controller: "AppCtrl",
            resolve: {
                data: dbService.getData(),
            }
        })
});

Aber ich bekomme diesen Fehler:

Fehler: Unbekannter Anbieter: dbService von EditorApp

Wie korrigiere ich das Setup und injiziere diesen Service?

Alex hat den richtigen Grund angegeben, warum er nicht in der Lage ist, das zu tun, was Sie versuchen, also +1. Dieses Problem tritt jedoch auf, weil Sie nicht genau festlegen, wie sie entworfen wurden.

resolveNimmt entweder die Zeichenfolge eines Dienstes oder eine Funktion, die einen zu injizierenden Wert zurückgibt. Da Sie Letzteres tun, müssen Sie eine tatsächliche Funktion übergeben:

resolve: {
  data: function (dbService) {
    return dbService.getData();
  }
}

Wenn das Framework aufgelöst wird, datawird es dbServicein die Funktion eingefügt , sodass Sie es frei verwenden können. Sie müssen überhaupt nicht in den configBlock injizieren , um dies zu erreichen.

Guten Appetit!

Richten Sie Ihren Dienst als benutzerdefinierten AngularJS-Anbieter ein

Trotz allem , was die akzeptierte Antwort sagt, Sie tatsächlich CAN tun , was Sie zu tun beabsichtigen, aber Sie müssen es einrichten als konfigurierbares Anbieter, so dass es während der Konfigurationsphase als Dienst verfügbar ist .. Zuerst Ihre ändern Servicezu einem Anbieter Wie nachfolgend dargestellt. Der Hauptunterschied besteht darin, dass Sie nach dem Festlegen des Werts von deferdie defer.promiseEigenschaft auf das Versprechenobjekt setzen , das zurückgegeben wird von $http.get:

Provider Service: (Provider: Servicerezept)

app.provider('dbService', function dbServiceProvider() {

  //the provider recipe for services require you specify a $get function
  this.$get= ['dbhost',function dbServiceFactory(dbhost){
     // return the factory as a provider
     // that is available during the configuration phase
     return new DbService(dbhost);  
  }]

});

function DbService(dbhost){
    var status;

    this.setUrl = function(url){
        dbhost = url;
    }

    this.getData = function($http) {
        return $http.get(dbhost+'db.php/score/getData')
            .success(function(data){
                 // handle any special stuff here, I would suggest the following:
                 status = 'ok';
                 status.data = data;
             })
             .error(function(message){
                 status = 'error';
                 status.message = message;
             })
             .then(function(){
                 // now we return an object with data or information about error 
                 // for special handling inside your application configuration
                 return status;
             })
    }    
}

Jetzt haben Sie einen konfigurierbaren benutzerdefinierten Anbieter, den Sie nur noch injizieren müssen. Der Hauptunterschied ist hier der fehlende "Provider on your injizable".

config:

app.config(function ($routeProvider) { 
    $routeProvider
        .when('/', {
            templateUrl: "partials/editor.html",
            controller: "AppCtrl",
            resolve: {
                dbData: function(DbService, $http) {
                     /*
                     *dbServiceProvider returns a dbService instance to your app whenever
                     * needed, and this instance is setup internally with a promise, 
                     * so you don't need to worry about $q and all that
                     */
                    return DbService('http://dbhost.com').getData();
                }
            }
        })
});

Verwenden Sie aufgelöste Daten in Ihrem appCtrl

app.controller('appCtrl',function(dbData, DbService){
     $scope.dbData = dbData;

     // You can also create and use another instance of the dbService here...
     // to do whatever you programmed it to do, by adding functions inside the 
     // constructor DbService(), the following assumes you added 
     // a rmUser(userObj) function in the factory
     $scope.removeDbUser = function(user){
         DbService.rmUser(user);
     }

})

Mögliche Alternativen

Die folgende Alternative ist ein ähnlicher Ansatz, ermöglicht jedoch die Definition innerhalb von .configund kapselt den Dienst innerhalb des spezifischen Moduls im Kontext Ihrer App. Wählen Sie die für Sie passende Methode. Im Folgenden finden Sie Hinweise zu einer dritten Alternative und hilfreiche Links, mit denen Sie all diese Dinge besser verstehen können

app.config(function($routeProvider, $provide) {
    $provide.service('dbService',function(){})
    //set up your service inside the module's config.

    $routeProvider
        .when('/', {
            templateUrl: "partials/editor.html",
            controller: "AppCtrl",
            resolve: {
                data: 
            }
        })
});

Einige hilfreiche Ressourcen

• John Lindquist hat eine hervorragende 5-minütige Erklärung und Demonstration auf Eierkopf.io , und es ist eine der kostenlosen Lektionen! Ich habe seine Demonstration grundlegend geändert, indem ich sie $httpim Kontext dieser Anfrage spezifisch gemacht habe
• Lesen Sie das AngularJS-Entwicklerhandbuch zu Anbietern
• Es gibt auch eine ausgezeichnete Erklärung zu factory/ service/ provider bei clevertech.biz .

Der Anbieter bietet Ihnen etwas mehr Konfiguration als die .serviceMethode, was sie als Anbieter auf Anwendungsebene besser macht. Sie können dies jedoch auch im Konfigurationsobjekt selbst kapseln, indem Sie $providewie folgt in die Konfiguration einfügen: