making synchrnous http call in a for loop angularjs

Question

I have an array of url and the requirement is that I have to make http.get requests in a synchronous manner. Only after the first url call is successful, the second one should be called

for(var i in urlArray)
{
    /*do some operations and get the next url*/
    $scope.alpha(newURL);
}

$scope.alpha = function (newURL) {
    $http.get(newURL) // these calls should be synchronous
    .success(function () {
    })
    .error(function () {
    });
}

How do I do this?

Answer 1

It seems what you really want to is make the calls sequentially, not necessarily synchronously.

In that case, don't use a loop (because it's synchronous). Simply make the next call in response to the previous call.

Simplified example:

var i = 0;
makeRequest(urlArray[i], function success() {
  var nextURL = urlArray[++i];
  if (nextURL) {
    makeRequest(nextURL, success);
  }
});

where makeRequest is the function that makes the Ajax request and calls the callback on success:

function makeRequest(url, callback) {
    $http.get(url).success(callback);
}

Answer 2

I am assuming that you want call them sequentially, in that case, you can use something like a recursion, call the function inside the .success callback

var currentURL; // calculate teh currentURL
$scope.alpha(currentURL);

$scope.alpha = function (newURL) {
    $http.get(newURL) // these calls should be synchronous
    .success(function (response, status, headers, config) {
        //get the response
        //generate the new currentURL as per your need

        //keep a break condition, to exit
        $scope.alpha(currentURL);

    })
    .error(function () {
    });
}

2) alternately you can you $q, deferred calls to achieve this

Hope this helps