Question

我想在服务中的angularJs中进行后续的ajax调用。

我尝试过这样的事情：

var requests = [
    {'url': 'call1'},
    {'url': 'call2'},
    {'url': 'call3'}
];

return $q.all([
    $http({
        url: requests[0],
        method: "POST"
    }).then( /*callback*/ ),
    $http({
        url: requests[1],
        method: "POST"
    }).then( /*callback*/ )
]);

但这使得alla ajax并行。我需要一种方法来进行后续调用，所以在第一次结束后，它会调用第二个....

Answer 1

你可以链接承诺：

  var requests =[{'url':'index.html'},
               {'url':'index.html'},
               {'url':'index.html'}];

function makeCall(n) {
  return $http({url:requests[n].url+"?n="+n,method:"GET"}).then(function(r) {
     if (n+1<requests.length) return makeCall(n+1);
  });
}
   makeCall(0);

http://plnkr.co/edit/1HdYUtHKe8WXAFBBq8HE?p=preview

Answer 2

您可以使用async.eachSeries：

var requests = ['call1', 'call2', 'call3'];

function iterator(request, done) {
    $http({
        url: request,
        method: "POST"
    }).then(done);
};

async.eachSeries(
    requests,
    iterator,
    function (err) {
        // Done
    }
);

来自readme：

eachSeries（arr，iterator，callback）   与每个迭代器相同，只是串行应用于数组中的每个项目。只有当前的迭代器完成处理后才会调用下一个迭代器。这意味着迭代器函数将按顺序完成。


arr - 要迭代的数组。

iterator(item, callback) - 一个应用于数组中每个项目的函数。迭代器传递callback(err)，必须在完成后调用它。如果没有发生错误，则应该在没有参数或显式空参数的情况下运行回调。

callback(err) - 在所有迭代器函数完成或发生错误后调用的回调函数。

Answer 3

你应该可以在“then”回调中调用另一个$ http调用，返回$ http的返回值

$http({...})
.then(function() {
  return $http({...});
 })
.then(function() {
  return $http({...});
});

这是有效的，因为每次调用$ http都会返回一个promise。如果你在“then”成功回调中返回一个promise，那么链中的下一个“then”回调将被推迟，直到该promise被解决，这将是ajax调用完成的时候。

编辑：在回复评论时，您可以循环遍历一系列请求：

var requests = [
   {'url':'call1','method':'get'},
   {'url':'call2','method':'get'},
   {'url':'call3','method':'get'}
];

var promise = null;
angular.forEach(requests, function(details) {
  promise = $q.when(promise).then(function() {
    return $http(details);
  });
});

在http://plnkr.co/edit/RSMN8WuPOpvdCujtrrZZ?p=preview的Plunker中。当$q.when设置为promise时，null仅用于循环的第一个值，因此它会立即调用then回调。

随后的ajax调用angularJs

3 个答案: