user1121487 user1121487 - 4 months ago 45
AngularJS Question

AngularJS factory http returns empty

I'm trying AngularJS for the first time. I'm getting JSON data from a http-get request using a factory, but the object is returned empty, before the ajax-request is done.

Factory:

myDemo.factory('photosFactory', function($http) {
var photos = [];

var factory = {};

factory.getPhotos = function() {
$http({
url: 'content/test_data.json',
method: 'GET'
}).success(function(data, status, headers, config) {
photos = data;
return photos;
});
};
return factory;
});


Controller:

controllers.AppCtrl = function($scope, $location, $http, photosFactory) {
$scope.photos = [];
init();
function init() {
$scope.photos = photosFactory.getPhotos();
}
};


This is what I've come up with. When the controller set $scope.photos, the value is empty as if it returns the photos array before it get populated with the ajax response.

Answer

You should modify your code to return a promise and use the value in controller pls see dummy modified code

myDemo.factory('photosFactory', function($http) {
 return{
    getPhotos : function() {
        return $http({
            url: 'content/test_data.json',
            method: 'GET'
        })
    }
 }
});

and controller -

controllers.AppCtrl = function($scope, $location, $http, photosFactory) {
    $scope.photos = [];
    photosFactory.getPhotos().success(function(data){
       $scope.photos=data;
   });
};
Comments