Question

在下面的代码中，我正在加载两个ajax请求。

第一个是'getTeams（）'，它加载了一组团队，每个团队都有一个id。对于每个团队，我然后使用id来获取与'getUsers（teamId）'中的id匹配的所有用户，并将其设置为teams [i] .users

然而，team [i] .users的设置不等待响应，并继续for循环。然后控制台记录创建的'团队'数组。然后才加载ajax请求。

在team [i] .users设置之前，有没有办法等待请求在'getUsers（）'内完成？

由于

function getUsers(teamId) {
    $.ajax({
        type: 'GET',
        dataType: "json",
        url: 'https://app.gohire.io/' + gohire.client.id + '/api/get-users/?teamId=' + teamId + '/',
        success: function(response) {
            return response;
        },
        error: function(data) { alert((data.responseJSON) ? ((data.responseJSON.error) ? data.responseJSON.error : 'An error occurred') : 'An error occurred'); }
    });
    return false;
}

function getTeams() {
    $.ajax({
        type: 'GET',
        dataType: "json",
        url: 'https://app.gohire.io/' + gohire.client.id + '/api/get-teams/',
        success: function(response) {
            teams = response;

            for (var i = 0; i < teams.length; i++) {
                var team = teams[i];
                teams[i].users = getUsers(teams[i].id);
            }

            console.log(teams);
            render();
        },
        error: function(data) { alert((data.responseJSON) ? ((data.responseJSON.error) ? data.responseJSON.error : 'An error occurred') : 'An error occurred'); }
    });
}
getTeams();

更新：这是我发现问题的唯一解决方案。虽然问题被标记为this question的副本，但我没有找到答案，因为主要问题（对我而言）是由for循环引起的。

然而，它确实帮助我找到了我的问题的实际答案，可以查看here

$.ajax({
    type: 'GET',
    dataType: "json",
    url: 'https://app.gohire.io/' + gohire.client.id + '/api/get-teams/',
    success: function(response) {
        teams = response;
        var ajaxCount = 0;

        // the below ajax request won't be called until later
        // therefore, 'i' must be captured, which is done by creating a new scope
        // creating a new scope in javascript is done by creating a new function
        for (i = 0; i < teams.length; i++) {
            (function(i) {
                $.ajax({
                    type: "GET",
                    dataType: "json",
                    url: 'https://app.gohire.io/' + gohire.client.id + '/api/get-users/?teamId=' + teams[i].id + '/',
                    success: function(request) {
                        teams[i].users = request || [];
                        // count ajax requests, to only render on last
                        ajaxCount++;
                        if (ajaxCount == teams.length) { render(); }
                    }
                });
            })(i);
        }
    },
    error: function(data) { alert((data.responseJSON) ? ((data.responseJSON.error) ? data.responseJSON.error : 'An error occurred') : 'An error occurred'); }
});

Answer 1

function getUsers(teamId, fun) {
    $.ajax({
        type: 'GET',
        dataType: "json",
        url: 'https://app.gohire.io/' + gohire.client.id + '/api/get-users/?teamId=' + teamId + '/',
        success: fun,
        error: function(data) { alert((data.responseJSON) ? ((data.responseJSON.error) ? data.responseJSON.error : 'An error occurred') : 'An error occurred'); }
    });
    return false;
}

function getTeams() {
    $.ajax({
        type: 'GET',
        dataType: "json",
        url: 'https://app.gohire.io/' + gohire.client.id + '/api/get-teams/',
        success: function(response) {
            teams = response;

            for (var i = 0; i < teams.length; i++) {
                var team = teams[i];
                getUsers(teams[i].id,function(teams[i].users){
                    //do the stuff here
                });
            }

            console.log(teams);
            render();
        },
        error: function(data) { alert((data.responseJSON) ? ((data.responseJSON.error) ? data.responseJSON.error : 'An error occurred') : 'An error occurred'); }
    });
}
getTeams();

变量的设置不会等到ajax完成

1 个答案: