javascript - 如何等待少数 HTTP promise 完成并仅在所有 promise 都失败时才显示模式

Question

我在一个页面上有两个 HTTP 调用，它们完全分开。

vm.$onInit = function() {
    ....
    ....
    //Get all the items only once during initialization
    ds.getAllItems().then(function(result){
      vm.items = result;
     },function(error){
      vm.errorInApi = true;
    });
    .....
    .....
}
vm.getTimes = function(){
    .....
    .....
    HttpWrapper.send(url,{"operation":'GET'}).then(function(times){
                    .....
}

如果这两个 API 都失败，那么我只需要显示一个模式。

我可以将变量初始化为 true，当 API 失败时，我可以将其设为 false，然后只显示模态。

但是完成所有 API 需要多长时间？

Answer 1

嗯...只需反转 promise 的极性并使用 Promise.all()。

Promise.all() 通常会在所有 promise 都解决后解决，因此一旦 promise 被反转，一旦所有 promise 都被拒绝它就会解决...

var invert = p => new Promise((v, x) => p.then(x, v));

Promise.all([Promise.reject("Error 404"), Promise.reject("Error WTF")].map(invert))
       .then(v => console.log(v));

因此，根据@guest271314 的评论，我用银勺扩展了解决方案，以展示如何将反转 promise 应用于此任务。

var invert = p => new Promise((v, x) => p.then(x, v)),
    prps   = [Promise.reject("Error 404"), Promise.reject("Error WTF")]; // previously rejected promises

myButton.addEventListener('click', function(e){
                                     setTimeout(function(...p){
                                                  p.push(Promise.reject("Error in Click Event Listener"));
                                                  Promise.all(p.map(invert))
                                                         .then(r => results.textContent = r.reduce((r,nr) => r + " - " + nr));
                                                }, 200, ...prps);
                                   });

<button id="myButton">Check</button>
<p id="results"></p>

如果任何 promise (包括之前获得的 promise 或事件处理程序中的一次)得到解决，您将不会获得任何输出。