一定要等到所有 Ajax 调用完成后才显示结果

问题描述

经过多次尝试，我勉强解决了一个问题，我依靠您来找到解决方案。

我想要做的是通过 twitch api 在表格中添加特定流媒体的观众人数。

所以我很好地调用了ajax：

        viewerCount(streamer){
        let viewers = [];
        let streamerList = streamer;

        for (let i = streamer.length-1 ; i >=0 ; i--){               
        
        $.ajax({
                type: 'GET',url: 'https://api.twitch.tv/helix/streams?user_login='+streamerList[i]+'',dataType:'JSON',headers: {
                        "Client-ID": 'bgbezb2vov7jc4twxauhw3yh30ubbx',"Authorization": "Bearer "+this.auth
                        },success: function(data) {
                    viewers.push([i,streamerList[i],data['data'][0]['viewer_count']])
                },error: function(data){
                    console.log(data)
                }            
            })
        };
 
    }

然后我将结果推送到我的表中，最后当我执行 console.log 时，我有索引、主播的名称和我的表中的观众数量。

问题是，在我想显示结果之前，我希望在显示之前完成所有ajax调用。我用 promise.all 进行了测试，但不幸的是我没有得到任何结果。

预先感谢您的帮助。

解决方法

使用下面的条件，您将能够检查是否所有调用都已完成：（检查代码注释）：

    viewerCount(streamer){
    let viewers = [];
    let streamerList = streamer;
    let completedCalls = 0; // init a new variable to base on
    for (let i = streamer.length-1 ; i >=0 ; i--){               
    
    $.ajax({
            type: 'GET',url: 'https://api.twitch.tv/helix/streams?user_login='+streamerList[i]+'',dataType:'JSON',headers: {
                    "Client-ID": 'bgbezb2vov7jc4twxauhw3yh30ubbx',"Authorization": "Bearer "+this.auth
                    },success: function(data) {
                viewers.push([i,streamerList[i],data['data'][0]['viewer_count']]);
            completedCalls++; // increase completedCalls
            },complete: function() { // <-- here the new code 
              if(completedCalls === streamer.length) {
                   displayYourResult();
              }
           },error: function(data){
                console.log(data)
            }            
        })
    };

}