Perché questo factory restituisce un oggetto stato $$ invece di response.data?

Question

Quindi ho una collezione di oggetti nel server Voglio popolare una ng-repeat quando la pagina viene caricata.

avevo un fatto una fabbrica che andò a prendere l'elenco da un risorsa sul server, in questo modo:

app.factory('objectArray', ['$http', function($http) { 
     // This is returning a $$state object 
     // instead of response.data... 
     return $http.post('/get_collection').then(function(response) { 
      console.log(response.data); 
      return response.data; 
     }); 
    }]); 

ho avuto questo lavoro codice prima di quando si utilizza ui-router e il resolve nella dichiarazione di stato. Tuttavia, quando iniettare questa fabbrica direttamente nel mio controller, invece di ricevere response.data, ricevo un oggetto $$ $$.

mio regolatore di simile a questa:

app.controller('applicationController', ['$scope', 'objectArray', function($scope, objectArray) { 
    $scope.array = objectArray; 
    console.log($scope.array); 
}]); 

Answer 1

ciò che il servizio http $ rendimenti (e quindi il servizio è objectArray) è chiamato una promessa. È possibile accedere ai dati effettivi registrando una funzione di callback che verrà chiamata quando i dati sono disponibili, vale a dire quando la risposta alla richiesta HTTP ritorna dal server:

objectArray.then(function(data) { 
    $scope.array = data; 
}); 

La ragione di avere direttamente accesso ai dati quando si utilizza la risoluzione è che il router, quando la funzione di risoluzione restituisce una promessa, attende che la promessa venga risolta. E solo allora, estrae i dati dalla promessa e li inietta nel controller.

Per capire meglio le promesse, è possibile leggere the following article (e il suo sequel).

Answer 2

Come notato @JB Nizet, è il codice è bene, basta risolverlo controller Qui sta demo funzionante

angular.module('app', []); 
 
angular.module('app').factory('objectArray', ['$http', function($http) { 
 
    // This is returning a $$state object 
 
    // instead of response.data... 
 
    ////// changed request type and url for the sake of example 
 
    return $http.get('http://jsonplaceholder.typicode.com/posts/1') 
 
.then(function(response) { 
 
    console.log(response.data); 
 
    return response.data; 
 
}); 
 
}]); 
 
angular.module('app').controller('applicationController', ['$scope', 'objectArray', function($scope, objectArray) { 
 
    //////resolve it here 
 
    objectArray.then(function(successResponse){ 
 
    $scope.array = successResponse; 
 
    console.log($scope.array); 
 
    }); 
 
}]); 
 
angular.bootstrap(document.body, ['app']);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-controller="applicationController"> 
 
    <h5>Hello {{array.title}}</h5> 
 
</div>