Return result to parent function

Question

I have been pulling my hair out here. I am using ion-autocomplete and want to pull data with a factory.

My Factory ...

myApp.factory('items', function($http){
   return {
      list: function(query,callback){
        $http.get('http://192.168.100.100/myApp/products/' + query).success(callback)
        }
        };
        });

To get the data I use ..

   items.list(function(items) {
      $scope.items = items;
    });

The demo for autocomplete request data like ..

  $scope.getTestItems = function (query) {
                    return {
                        items: [
                            {id: "1", name: query + "1", view: "view: " + query + "1"},
                            {id: "2", name: query + "2", view: "view: " + query + "2"},
                            {id: "3", name: query + "3", view: "view: " + query + "3"}]
                    };
                };

So I figure this is a workable solution ..

   $scope.getTestItems = items.list(query,function(items)
        {   
        console.log(items);
        return items;
        }
        )

but clearly is not. I have tried ..

   $scope.getTestItems = function(query)
   {
   items.list(query,function(items)
        {   
        console.log(items);
        return items;
        }
        )
    }

Which does give me a console of the result but this is not returned to getTestItems

You can't return your data from an asynchronous function like that. This is more of a thinking in javascript problem. — twsaef, Jul 28 '15 at 04:47
Here's an older question dealing with this problem from a jQuery perspective which might help you - http://stackoverflow.com/questions/14220321/how-to-return-the-response-from-an-asynchronous-call/14220323#14220323 — twsaef, Jul 28 '15 at 04:50

Phil · Accepted Answer · 2015-07-28T04:55:11.163

According to the docs (assuming I've got the right lib here), you can return a promise

myApp.factory('items', function($http){
    return {
        list: function(query) {
            return $http.get(... + query).then(function(res) {
                return res.data; // unwrap the response data
                // see the "Returns" section at https://docs.angularjs.org/api/ng/service/$http#usage
            });
        }
    };
});

and the controller

$scope.getTestItems = function(query) {
    return items.list(query);
};

score 0 · Answer 2 · answered Jul 28 '15 at 04:50

How about this

Factory

 list: function(query,callback){
    return $http.get('http://192.168.100.100/myApp/products/' + query)
 }

In this way you are returning the promise from the factory.

Controller

$scope.getTestItems = function(query){
  items.list(query).then(function(items){   
    console.log(items);
  });
}

The callback will execute as soon as the promise resolves.

score 0 · Answer 3 · answered Jul 28 '15 at 05:05

you could try this,

myApp.factory('items', function($http){
   return {
      list: function(query){
       return $http.get('http://192.168.100.100/myApp/products/'+query);
        }
        };
        });

then in your controller

var promise = items.list(query);
promise.then(function(response){
//here we go
$scope.items = angular.fromJson(JSON.parse(response.data));
});

Return result to parent function

3 Answers3