时间戳

首页 > 解决方案 > forEach 循环中的 AJAX 函数

javascript - forEach 循环中的 AJAX 函数

问题描述

我有一个在视图列表中执行 foreach 循环的函数，并且需要为循环中的每个视图发送 AJAX 请求。当它在成功函数中获得结果时，它会检查是否返回了特定的 Id，如果是，则将此视图添加到 selectBox。问题是，当我尝试在 selectBox 上定义 .change 事件时，它给了我一个错误，因为没有添加任何选项。我曾考虑过添加 ajaxStop，但我有其他不同的 AJAX 请求。有谁知道我怎么能等到那些 Ajax 请求完成，但没有其他人？

 var newdiv = $('<div id="viewListDiv" style ="margin:auto" ></div> ')
    var selectBox = $('<select id = "ViewsList" class="form-control" style="width:250px;margin-left: 70px; margin-rigth:70px;" ></select>');
views.forEach(function (view)
    {
        _this.continue = true;
        var guid = view.search({ "type": "resource" })[0].data.guid;
        jQuery.ajax({
            url: "api/forge/modelderivative/metadata/model",
            data: {
                "urn": urn,
                "viewableId": guid,
            },
                success: function (metadata) {
                    _this.getIds(metadata.data);
                    if (_this.listdbId.includes(dbId[0])) {
                        var newOpt = new Option(view.data.viewableID, view.data.name);
                        selectBox.append(newOpt);
                    }
                    _this.listdbId = []
                }
        });
    });
        selectBox = selectBox[0];
        selectBox.change(function (opt) {
            //launch change function
    });

标签： javascriptjqueryautodesk-forgeautodesk-viewer

解决方案

它看起来更像是一个纯 Javascript 问题，而不是 Autodesk Forge Viewer。无论如何，无论您选择使用fetch或jquery.ajax，AJAX 调用都是异步工作。我们需要利用 Promise 来确保调用完成。这是您的代码片段的修订版：

const getModel = (view) => {
    return new Promise((resolve, reject) => {
        let guid = view.search({ "type": "resource" })[0].data.guid;
        jQuery.ajax({
            url: "api/forge/modelderivative/metadata/model",
            data: {
                "urn": urn,
                "viewableId": guid,
            },
            success: function (metadata) {
                resolve(metadata);
            }
        }).fail((jqXHR, textStatus) => reject(jqXHR, textStatus));
    });
};

const tasks = views.map((view) => getModel(view));
const results = await Promise.all(tasks);

for(let i=0; i<results.length; i++) {
    let metadata = results[i];

    //..
}

推荐阅读