Angular.js promises $http.get

Question

i have service which makes an $HTTP.GET request, at first i tried to access the object $$state but the value inside was undefined, so i went and red about promises and asynchronous calls here: http://blog.ninja-squad.com/2015/05/28/angularjs-promises/

after i red everything i tried again as guided but still it doesn't work for me :-(, please advise, i want to access the values object.

service:
function ConnectMe($http) {

function OnAction() {

    this.create = function (search, key) {
        return $http.get("https://www.tastekid.com/api/similar?q=" + search + "&verbose=1&k=" + key).then(function (response) {
            return response.data;
        });

    };
}

var connection = new OnAction();

return function () {
    return connection;
};
}


controller:
function TasteConroller($scope, ConnectMe) {
$scope.apiKey = "https://www.tastekid.com/api/similar?q=" + $scope.UserPick + "&verbose=1&k=254357-MatureAm-A31YEAIX";
$scope.UserPick = "red+hot+chili+peppers";
$scope.Key = "254357-MatureAm-A31YEAIX";
var srv = ConnectMe();

srv.create($scope.UserPick, $scope.Key).then(function(data) {
    $scope.results = data;
}), function() {
    $scope.error = 'unable to get the ponies';
};

console.log($scope.results);

it doesn't work for me is much too vague. Post all the relevant code, create a plunkr reproducing the issue, tell precisely what you expect to happen, and what happens instead. Thanks for reading this article (I wrote it) :-) Note that console.log($scope.results); will always print undefined, since it's executed before the callback function passed to then(). That's the same trap as I describe in the section So let’s fix the code again. You fell into it :-( Asynchronous code is asynchronous. — JB Nizet
– JB Nizet, Commented Jan 6, 2017 at 19:38
hu... i used console.log as my indicator, when u said it won't work i tried to print it on the screen, and it worked :-)...i guess i have a lot of work to figure out hot to arrange all that mess without console.log — tomersss2
– tomersss2, Commented Jan 6, 2017 at 19:48
You need to understand the principle of asynchronism. You can't just put a toast in the toaster (i.e. call srv.create()), and start eating it right after (i.e. calling console.log()). You need to do something else while and the toaster does its job. You can only eat the toast (i.e. call console.log()) when the toaster tells you that the toast is ready (i.e. when the promise calls the callback function(data) passed to then()). So, put the console.log() inside that function. — JB Nizet
– JB Nizet, Commented Jan 6, 2017 at 20:00
huu right, i understand now! thanks man, not just for that but for all the effort u put in ur articles it's very helpful. — tomersss2
– tomersss2, Commented Jan 6, 2017 at 20:17

jusopi · Accepted Answer · 2017-01-06 19:52:11Z

1

Your service code looks a little suspect. I normally create a service like this;

function ServiceFunc( $http, $q ){
    return {
        OnAction: function( search, key ){ 
            return $http.get(...)
                   .then( function( rsp ){ return rsp.data.foo })
                   .catch( function( err ){ $q.reject( err )})
    }
}

I think you may have had a deeper level of functions whereby you weren't actually calling it.

answered Jan 6, 2017 at 19:52

jusopi

6,8133 gold badges37 silver badges44 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular.js promises $http.get

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related