Question

我想在完成第一次成功之后调用api。但在我的代码中，它在第一个完成之前调用api

  for(var w=0;w<Ids.length;w++){
      $scope.msgObject = {
               "SenderID":$scope.pageId,
               "PageID" : $scope.pageId,
                "Date":Date.now().toString(),
              };

        $http({
            method: 'POST',
           url: '///url',
           async:true,
            data: $scope.msgObject,
            headers: {
                'Content-Type': 'application/json'
            }})
            .then(function(response) {
              console.log("success posting");
              }
            })
             .catch(function(response){

            });
      $(".messageInput").val('');


      }
    }
  }
}

Answer 1

function asyncForEach(arr, cb) {
    return arr.reduce((p,c)=>{
        return p.then(()=> cb(c));
    }, Promise.resolve());
}

function fetch(id) {
  return new Promise(resolve=>
    setTimeout(resolve, 100)) // replace with your AJAX call
      .then(()=>console.log('success posting', id));
}

function done() {
    console.log('all done!');
}

const ids = [1, 2, 3, 4, 5];
asyncForEach(ids, fetch).then(done);

Answer 2

把你的循环放在那里

之类的东西

function urPostMethod(url){

$scope.msgObject = {
               "SenderID":$scope.pageId,
               "PageID" : $scope.pageId,
                "Date":Date.now().toString(),
              };

        $http({
            method: 'POST',
           url: url,
           async:true,
            data: $scope.msgObject,
            headers: {
                'Content-Type': 'application/json'
            }})
            .then(function(response) {
              console.log("success posting");
              while(Ids.length>0)urPostMethod(Ids.pop());
              }
            })
             .catch(function(response){

            });
      $(".messageInput").val('');


      }
    }
  }
}

Answer 3

您要做的是将异步和同步操作混合在一起，这根本不符合逻辑。

如果您需要按照数组中元素的顺序调用这些API，您可以使用其他方法，例如使用Defer管道请求：

var dfd = $.Deferred(),  
    x = 0, // Loop index
    Ids = [],
    msgObject = {
       "SenderID":$scope.pageId,
       "PageID" : $scope.pageId,
        "Date":Date.now().toString(),
      };


    callAjax = function (value) {
        var dfdAjax = $.Deferred();

        $.ajax({
            method: 'POST',
            url: '///url',
            async:true,
            data: msgObject,
            headers: {
                'Content-Type': 'application/json'
            }})
        .then(function(response) {
           dfdAjax.resolve(response);
        })
        .catch(function(response){
            dfdAjax.reject(response);
        });        

        return dfdAjax.promise();
    },

    requestAjax = function (value) {
        return callAjax(value);
    };

dfd.resolve();

for (x = 1; x <= Ids.length; x++) {

    dfdNext = dfdNext.pipe(function () {        
        return requestAjax(value).
            done(function(response) {
                // Process the response here.
            });

    });

}

Answer 4

您可以使用$q.all()并简化语法，您只需要注入$q服务。

以下代码将$http返回的所有承诺添加到单个数组中，使用$q.all()执行承诺，然后收集结果。

var requests = [];

for(var w = 0; w < Ids.length; w++) {    
    var req = $http({
        method: 'POST',
        url: '///url',
        headers: { 'Content-Type': 'application/json' },
        data: {
          SenderID: $scope.pageId,
          PageID: $scope.pageId,
          Date: Date.now().toString(),
        }
    })
        .catch(function(err) {
            // handle err 
        });

    requests.push(req);
}

$q.all(requests)
    .then(function (results) {
        // handle results
    });;

如何在http调用成功之前调用for循环中的http调用？

4 个答案: