javascript - 如何以 Angular 连续顺序运行异步

Question

这个问题已经有答案了:

How can I execute array of promises in sequential order? (9 个回答)

已关闭 6 年前。

 $scope.SaveAuditItems = function (audit) {
    var isError = false;
    $scope.isProcessing = true;
    var defer = $q.defer();
    var promises = [];

    for (var siteCounter = 0; siteCounter < audit.SessionSiteList.length; siteCounter++) {
        for (var itemCounter = 0; itemCounter < audit.SessionSiteList[siteCounter].AuditItemList.length; itemCounter++) {
            var item = audit.SessionSiteList[siteCounter].AuditItemList[itemCounter];

            item.TotalItems = audit.SessionSiteList[siteCounter].AuditItemList.length;
            item.CurrentItem = itemCounter;

            promises.push($scope.submitaudit(item));
        }
    };
     //It appears to be running all the promises in the array in parrallel then running CloseAudit.
        $q.all(promises).then(
            function (response) {
                $scope.CloseAudit(audit.AuditSessionId).then(function () {
            },
            function(){
                alert("done");
            },
            function(){
                alert("done");
            }
            );
        }).catch(function (exception) {
            $scope.Loading("Could not submit audit session #'+ audit.AuditSessionId +' , please try again.", 2000);
        });


}

如何使 Promise 按连续顺序运行？它会导致服务器数据提交时出现竞争条件吗？这个 Angular 1 代码。

当我不知道我将按顺序运行多少个 promise 时，我该如何使用？所有其他答案都使用 then 但始终是预定义的 promise 数量。我不能永远有一个然后……我似乎无法理解我是如何做到这一点的。

------------------------------------编辑2-------- --------------------------------------------------

  $scope.SaveAuditItems = function (audit) {
    $ionicLoading.show({
        template: '<i class="icon ion-loading-c"></i>Please wait..Sending Item ( 1 Of ' + $scope.AuditItemCounter + ' )',
    }).then(function () {});
    var isError = false;
    $scope.isProcessing = true;
    var defer = $q.defer();
    var promises = [];

    for (var siteCounter = 0; siteCounter < audit.SessionSiteList.length; siteCounter++) {
        for (var itemCounter = 0; itemCounter < audit.SessionSiteList[siteCounter].AuditItemList.length; itemCounter++) {
            var item = audit.SessionSiteList[siteCounter].AuditItemList[itemCounter];

            item.TotalItems = audit.SessionSiteList[siteCounter].AuditItemList.length;
            item.CurrentItem = itemCounter;
            // $scope.Loading('Sending Item ( ' + item.CurrentItem + ' Of ' + item.TotalItems + ' )..', 0).then(function () {

            promises.push($scope.submitaudit(item));



            ConsoleLogger.AddLog('Sent Item ( ' + item.CurrentItem + ' Of ' + item.TotalItems + ' )');

            //Loading.show({ template: '<i class="icon ion-loading-c"></i>Sending Item ' + item.CurrentItem + ' of ' + item.TotalItems + ' ', }).then(function () { });
            $scope.Loading('Sent item ( ' + item.CurrentItem + ' Of ' + item.TotalItems + ' )', 0).then(function () {});


        }
    }

    var all = promises.reduce(function (cur, next) {
        return cur.then(next);
    }, Promise.resolve(true));


    all.then(function (a) {
        $ionicLoading.show({
            template: '<i class="icon ion-loading-c"></i>Finalising your audit..'
        }).then(function () {
                $scope.CloseAudit(audit.AuditSessionId).then(function () {
                    ConsoleLogger.AddLog('Audit submitted successfully.');
                });
            },
            function () {
                alert("doneeee");
            },
            function () {
                alert("done");
            }
        );
    });

您可以从时间上看到，promise 没有按预期顺序运行？我缺少什么？我以 7 秒的超时时间做出了 promise 。closeaudit 应该在所有 promise 返回后运行，但对我来说没有发生!

通过改变让它发挥作用 Promise.push($scope.submitaudit(item));至

 promises.push(function(){return $scope.submitaudit(item)});

Answer 1

这是一个如何执行此操作的快速示例。将数组中的所有 Promise 逐一归约，reduce 函数将链接每个 Promise 的 then()。它将从第一个开始，第一个解决后，它将调用第二个，依此类推......直到结束；]。

var promises = [
	function() { return new Promise(function(resolve, reject) {
  	setTimeout(function() {
    	console.log('resolve promise 1 after 3sec');
    	resolve('promise 1');
    }, 3000)
  })},
  function() { return new Promise(function(resolve, reject) {
  	setTimeout(function() {
    	console.log('resolve promise 2 after 1.5sec');
    	resolve('promise 2');
    }, 1500)
  })},
  function() { return new Promise(function(resolve, reject) {
  	setTimeout(function() {
    	console.log('resolve promise 3 after 2sec');
    	resolve('promise 3');
    }, 2000);
  })}];

var all = promises.reduce(function(cur, next) {
    return cur.then(next);
}, Promise.resolve(true));


all.then(function(a) {
    console.log('all are done!');
});