确保等到所有 Ajax 调用完成后再显示结果

Question

一个问题我试了几次就凑合了，就靠你了。

我想做的是通过 twitch api.

在 table 中添加特定主播的观看人数

所以我 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)
                }            
            })
        };
 
    }

然后我将结果推送到我的 table 中，最后当我这样做时 console.log 我在我的 [=29= 中有索引、主播名称和观众人数].

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

提前感谢您的帮助。

Answer 1

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

    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)
            }            
        })
    };

}

确保等到所有 Ajax 调用完成后再显示结果

Make sure to wait until all Ajax calls are completed before displaying the result

javascript

ajax

asynchronous

promise

twitch