AngularJS Daten vom Dienst laden

Question

Ich habe ein Problem beim Abrufen von Daten aus einem Service, der in meiner Ansicht enthalten ist. Ich habe ein Dienst definiert als solche

app.factory('nukeService', function($rootScope, $http) { 
    var nukeService = {}; 

    nukeService.nuke = {}; 

    //Gets the list of nuclear weapons 
    nukeService.getNukes = function() { 
     $http.get('nukes/nukes.json') 
      .success(function(data) { 
       nukeService.nukes = data; 
      }); 

     return nukeService.nukes; 
    }; 

    return nukeService; 
}); 

und mein Controller

function NavigationCtrl($scope, $http, nukeService){ 



    /*$http.get('nukes/nukes.json').success(function(data) { 
     $scope.nukes = data; 
    });*/ 

    $scope.nukes = nukeService.getNukes(); 

} 

Wenn ich die $ http.get vom Controller verwenden die Daten auffüllt in Ordnung, aber wenn ich versuche, um die Daten zu nennen aus Der Service, ich bekomme nichts. Ich verstehe, dass die Abfrage asynchron ist, aber es ist mir schwer zu verstehen, wie die $ scope-Variable gefüllt wird, sobald die Daten zurückgegeben werden. Ich könnte $ rootscope verwenden, um ein Ereignis zu übertragen und darauf im Controller zu hören, aber das scheint nicht der richtige Weg zu sein, dies zu erreichen. Ich würde wirklich jeden Hinweis schätzen, wie man das richtig macht.

Answer 1

ich denke, das Ihr Problem Dies ist ein Problem mit Objektreferenz

app.factory('nukeService', function($rootScope, $http) { 
    var nukeService = {}; 

    nukeService.data = {}; 

    //Gets the list of nuclear weapons 
    nukeService.getNukes = function() { 
     $http.get('nukes/nukes.json') 
      .success(function(data) { 
       nukeService.data.nukes = data; 
      }); 

     return nukeService.data; 
    }; 

    return nukeService; 
}); 

function NavigationCtrl($scope, $http, nukeService){ 

    $scope.data = nukeService.getNukes(); 

    //then refer to nukes list as `data.nukes` 

} 

lösen sollte.

Wenn Sie nukeService.getNukes() aufrufen erhalten Sie einen Verweis auf ein Objekt a dann bezieht sich Ihre Variable $scope.nukes auf diesen Speicherort.

Nach dem Remote-Anrufserver, wenn Sie nukeService.nukes = data; setzen Sie ändern nicht das Objekt a stattdessen Sie nukeService.nukes von ändern Objekt referenziert ab zu widersprechen. Aber Ihre $scope.nukes weiß nicht über diese Neuzuweisung und es zeigt immer noch auf Objekt a.

in diesem Fall Meine Lösung ist es, ein Objekt a mit Eigentum data und dann nur die Daten Eigenschaft wie folgt ändern Dies sollte

Answer 2

-a statt Ändern Referenz zu übergeben. Wie von NickWiggill's Kommentar erwähnt, wird undefined zu nukeService.data zugewiesen, wenn wir kein Versprechen abgeben.

Answer 3

Was ich mache ist, dass ich die Daten direkt aus dem Dienst verfügbar machen, und habe eine Methode, die diese Daten initialisiert. Was ist daran falsch?

Service:

app.factory('nukeService', function($scope, $http) { 
    var data = {}; 
    data.nukes = []; 

    //Gets the list of nuclear weapons 
    var getNukes = function() { 
     $http.get('nukes/nukes.json').success(function(data) { 
       data.nukes = data; 
     }); 
    }; 

    // Fill the list with actual nukes, async why not. 
    getNukes(); 

    return { 
     data : data 
     // expose more functions or data if you want 
    }; 
}); 

Controller:

function NavigationCtrl($scope, nukeService){ 
    $scope.data = nukeService.data; 
    //then refer to nukes list as `$scope.data.nukes` 
}