nested angular http.get calls

Question

I have a simple angular $http.get, which returns a json object, but I want the id from the json to do another $http.get. I can do this by nesting another $http.get with the first one, but this seems rather stupid. What is the best way to assign the id of the response, data.id, to a variable? I'm having some issues with variable scope; trying to simply assign the value to a variable.

$http.get('/api/v1/foo/userinfo?thunk='+thunk+'&bar='+bar).success(function(data) {
    $scope.id = data.id
}).then(function(data){
    $scope.id = data.data.id
});

Joao Almeida · Accepted Answer · 2014-03-23 18:57:13Z

1

Why don't you watch your variable, in this case $scope.id like this:

$scope.$watch('id', function() {
       // Http request goes here
       $http.get(...)
});

When you assigned any value to $scope.id your "watch function" will be triggered.

answered Mar 23, 2014 at 18:57

Joao Almeida

9822 gold badges6 silver badges19 bronze badges

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

Comments

tymeJV · Accepted Answer · 2014-03-23 18:27:03Z

0

Can use callbacks to make it cleaner. Wrap your call in a function:

function startAJAX(thunk, bar, callback) {
    $http.get('/api/v1/foo/userinfo?thunk='+thunk+'&bar='+bar).success(function(data) {
        callback(data.id);
    });
}

Then make the call and do your next http call:

startAJAX(thunk, bar, function(id) {
    $http(id).....

    });
});

answered Mar 23, 2014 at 18:27

tymeJV

105k14 gold badges165 silver badges158 bronze badges

Comments

user1558249 · Accepted Answer · 2015-03-04 14:11:38Z

0

Using a watch() method isn't necessary. Use callbacks, or if you want to be fancy use promises to keep things organized.

var callOnePromise = $http.get('/api/foo');
var callTwoPromise;
callOnePromise.success(function(data) {
    callTwoPromise = $http.get('/api/bar/' + data.id);
});
callTwoPromise.success(function() {
    //Cool stuff here.
});

answered Mar 4, 2015 at 14:11

user1558249

Collectives™ on Stack Overflow

nested angular http.get calls

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related