javascript - 如何避免 $http promise Angular 1.5 的竞争条件

Question

我遇到一种情况，我不希望一个 promise 在另一个(或可能还有其他几个)完成之前完成。在这种情况下，我有不同的付款选项，每次用户单击按钮时，都会进行付款...在付款时，用户还可以单击删除。这会导致奇怪的竞争条件，即在付款完成之前处理删除。在付款操作完成之前，我不希望删除处理/访问数据库。相关代码如下:

 $ctrl.deletePayment = function(paymentRecord) {
  PaymentsService.deletePaymentRequest($ctrl.paymentRecord.id, paymentRecord)
    .then(updateTotal)
    .catch(updateTotal);
}

$ctrl.payOff = function(dataItem) {
  let payOffRecords = dataItem.payoffRecords;
  PaymentsService.submitPaymentRequestViaPatch($ctrl.temporaryPaymentAdvice.id, payOffRecords)
    .then(updateTotal)
    .catch(updateTotal);
}

$ctrl.payAllInView = function(payOff) {
  let paymentRecords = dataSource.map((rowItem) => {
    return rowItem.payoffRecords;
  });
  if (paymentRecords.length > 0) {
    PaymentsService.submitPaymentRequestViaPatch($ctrl.temporaryPaymentAdvice.id, paymentRecords)
      .then(updateTotal)
      .catch(updateTotal);
  }
}

在付款操作完成之前，如何阻止deletePayment 被处理？我正在考虑显示一个模式来阻止 UI，但也想知道是否有一种 Angular 方法来处理这种异步/竞争条件。

Answer 1

您可能希望存储 promise 以供引用，并使用 $q.all(...) 确保一切都已完成，然后再继续。大致如下:

let promises = [];
$ctrl.deletePayment = function(paymentRecord) {
  $q.all(promises).then((values) => {
    promises = [ PaymentsService.deletePaymentRequest(...)
      .then(updateTemporaryPaymentAdviceTotal)
      .catch(updateTemporaryPaymentAdviceTotal) ];
  });
}

...每个方法在调用时都需要将其 Promise 添加到 Promise 数组中。