javascript - Cordova SQLite 插件 promise javascript 链

Question

大家好，所以我尝试在一次迭代中调用 3 个 Promise，然后在它们完成后再迭代一次并再次调用它们。谁能帮我解决这个问题吗？

for(i=0;i<$scope.CurrentES.Issues.length;i++){
    app.Logger($scope.CurrentES.Issues[i])
    var promiseEvidence = $cordovaSQLite.execute(db, queryEvidence, [$scope.CurrentES.Issues[i].Evidence.Id]).then(function(result){
    app.Logger(result.rows.item(0).ImageID);
    app.Logger(result.rows.item(0).SupportingDocumetID);
    app.Logger(result.rows.item(0).QuoteID);
    var promiseImageLib = $cordovaSQLite.execute(db, queryImgLib, [result.rows.item(0).ImageID]).then(
        function (r) {
            if (r.rows.length != 0) {
                var img = r.rows.item(0);
                issue.Evidence.ImageLibary.Id = img.id;
                issue.Evidence.ImageLibary.ServerID = img.ServerID;
                issue.Evidence.ImageLibary.Conclude = img.Conclusion;
                issue.Evidence.ImageLibary.ImageTitle = img.Title;
                issue.Evidence.ImageLibary.Image = img.Image;
            }
        }, function (e) {
            app.Logger(e);
        });
        var promiseSupp = $cordovaSQLite.execute(db, querySupp, [result.rows.item(0).SupportingDocumetID]).then(
            function (r) {
                if (r.rows.length != 0) {
                    var sup = r.rows.item(0);
                    issue.Evidence.SupportingDocument.Id = sup.id;
                    issue.Evidence.SupportingDocument.ServerID = sup.ServerID;
                    issue.Evidence.SupportingDocument.Link = sup.Link;
                    issue.Evidence.SupportingDocument.Title = sup.Title;
                    issue.Evidence.SupportingDocument.Quoatation = sup.Extract;
                }
            }, function (e) {
                app.Logger(e);
            });
            var promiseQuote = $cordovaSQLite.execute(db, quesryQuote, [result.rows.item(0).QuoteID]).then(
                function (r) {
                    if (r.rows.length != 0) {
                        var quot = r.rows.item(0);
                        issue.Evidence.Quote.Id = quot.id;
                        issue.Evidence.Quote.ServerID = quot.ServerID;
                        issue.Evidence.Quote.Quoatation = quot.QuoteLegend;
                        issue.Evidence.Quote.Attributed = quot.QuoteText;
                    }
                }, function (e) {
                    app.Logger(e);
                });
                $q.all([promiseImageLib,promiseSupp,promiseQuote]).then(function(r){
            })
        });
        var isDone = $q.all([promiseEvidence]).then(function(r){

    })
}

Answer 1

考虑这个问题的一个好方法是， promise 链的构建独立于它们的执行。一旦你建立了这个思维模型，就很容易推理。

让我们将其分解为多个步骤并从那里构建我们的代码。

执行异步代码并允许操作在完成后发生:

function doSomeAsyncWork(){
   var promise1 = foo();
   var promise2 = bar();
   var promise3 = blah();

   return $q.all([promise1, promise2, promise3]);
}

按顺序重复此代码 N 次。第一次迭代运行后。

function doWorkNTimes(n) {
 var lastPromise;

 for (var i = 0; i < n; i++) {
     //After initial promise, keep
     // chaining them together
     if (lastPromise) {
       lastPromise = lastPromise.then(function(items) {
         return doStuffAsync(i);
       });
     } else {
       lastPromise = doStuffAsync(i);
     }
 }

 return lastPromise;
};

这是一个稍微复杂一些的工作示例，但应该可以说明这一点。

(function() {
  'use strict';

  function getRandomInt(min, max) {
    return Math.floor(Math.random() * (max - min)) + min;
  }

  function promiseController($q, $timeout) {
    var vm = this;

    vm.results = [];

    vm.numTimes = 3;

    vm.isBusy = false;

    vm.isDone = true;

    vm.doWork = function(times) {
      vm.results.splice(0);
      vm.isBusy = true;
      vm.isDone = false;

      doWorkNTimes(vm.numTimes || 1)
        .finally(function() {
          vm.isBusy = false;
          vm.isDone = true;
        });
    };

    function doWorkNTimes(n) {
      var lastPromise;

      for (var i = 0; i < n; i++) {
        (function(i) {
          if (lastPromise) {
            lastPromise = lastPromise.then(function(items) {
              return doStuffAsync(i);
            });
          } else {
            lastPromise = doStuffAsync(i);
          }

          lastPromise.then(function(items) {
            //console.log(items);

            vm.results.push(items);
          });
        }(i));
      }

      return lastPromise;
    };

    function doStuffAsync(i) {
      var prom1 = createPromise(i),
        prom2 = createPromise(i),
        prom3 = createPromise(i);

      return $q.all([prom1, prom2, prom3]);
    }

    function createPromise(i) {
      var timeout = getRandomInt(200, 2000);

      return $timeout(function() {

        var item = {
          iteration: i,
          executionTime: timeout
        };

        //console.log(item);

        return item;

      }, timeout);
    }
  }

  angular.module('promise-sample', [])
    .controller('promiseController', promiseController);

}());

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.4/angular.min.js"></script>

<div class="container" ng-app="promise-sample" ng-controller="promiseController as ctrl">
  <div class="row">
    <div class="col-xs-6">
      <div class="form-group">
        <label>Number of Iterations</label>
        <input type="number" class="form-control" min="0" max="10" ng-model="ctrl.numTimes" />
      </div>
      <div class="form-group">
        <button type="button" class="btn btn-primary" ng-click="ctrl.doWork()">Run {{ctrl.numTimes}} Times</button>
      </div>
    </div>
    <div class="col-xs-6">
      <table class="table table-striped" ng-repeat="set in ctrl.results">
        <thead>
          <tr>
            <th>Run</th>
            <th>Time</th>
          </tr>
        </thead>
        <tbody>
          <tr ng-repeat="item in set">
            <td>{{::item.iteration}}</td>
            <td>{{::item.executionTime}}</td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</div>