angularjs 按顺序链接 http post

Question

在我的应用程序中，我将数据存储在本地存储中并在后台触发异步 http post。成功 posted 后，posted 数据将从本地存储中删除。当httppost在处理的时候，可能会有更多的数据添加到本地存储所以我需要排队post并顺序处理它因为，我需要等待本地存储被清除成功的 posts。应递归调用该任务，直到本地存储中有数据为止。

taskQueue: function () {
    var deferred = $q.defer();
    queue.push(deferred);
    var promise = deferred.promise;

    if (!saveInProgress) {
      // get post data from storage
      var promises = queue.map(function(){$http.post(<post url>, <post data>).then(function(result){
          // clear successful data
          deferred.resolve(result);
      }, function(error){
         deferred.reject(error);
      })
    })

    return $q.all(promises);
}

作为 angular 新手，我遇到了上面代码不连续的问题。我怎样才能实现我的意图？队列长度未知，并且队列长度随着进程的进行而增加。如果这是重复的，请指出其他答案。

Answer 1

实现此目的的简单方法是使用 Async.js。在那里你可以找到一个名为 mapSeries 的方法。你可以运行它在队列中，它会一个一个地顺序处理数组的所有元素，只有当正确的回调被调用时才会继续处理下一个元素。

Answer 2

Async.js 听起来不错，但如果您不想使用库 ...

$q.all 将批处理一组请求并同时触发它们，并在数组中的所有承诺都解析时解析 - 这不是您想要的。

要从数组中按顺序调用 $http，请执行此操作....

var request0 = $http.get('/my/path0');
var request1 = $http.post('/my/path1', {data:'fred'});
var request2 = $http.get('/my/path2');
var requestArray = [];

然后...

requestArray.push(request0);
requestArray.push(request1);
requestArray.push(request2);

然后...

requestArray[0].then(function(response0) {
    // do something with response0
    return requestArray[1];
}).then(function(response1) {
    // do something with response1
    return requestArray[2];
}).then(function(response2) {
    // do something with response2
}).catch(function(failedResponse) {
    console.log("i will be displayed when a request fails (if ever)", failedResponse)
});

Answer 3

虽然有库解决方案会很棒（根据@nstoitsev 的回答），但没有它也可以。

未知长度的连续请求

简单回顾一下：

我们不知道请求的数量
每个响应可能使另一个请求入队

一些假设：

所有请求都将处理一个公共数据对象（在您的情况下为本地存储）
所有请求都是承诺

运行队列

function postMyData (data){
    return $http.post(<url>, data)
}

var rqsts = []

function executeQueue (){

    if(!rqsts.length)
         //we're done
         return

    var rqst = rqsts.shift()        
    rqst()
    .then(function(rsp){
        //based on how you're determining if you need to do another request...  
        if(keepGoing)
            rqsts.push(postMyData(<more data>))           
    })
}

codepen - http://codepen.io/jusopi/pen/VaYRXR?editors=1010

我故意让这个含糊不清，因为我不明白失败的条件是什么，如果您想改变请求以使用多个相同的 $http.post 调用，您可以将其传回某种方式。

只是一个建议

As angular newbie...

很多事情都在朝着整个函数式、反应式编程范式发展。由于您对 Angular 比较了解并且 NG2 已经内置了其中一些，因此它可能值得您关注。我认为 rxjs 已经在许多 NG2 示例包中。

angularjs 按顺序链接 http post

angularjs chain http post sequentially

angularjs

angular-promise

未知长度的连续请求

运行队列

只是一个建议