Javascript 异步加载选择列表选项

我正在使用AJAX从公共服务提供商DAWA检索有关市政名称、Zipcode等的信息。起初，在异步传输之前，我在检索数据时遇到了一个问题，因此AjaxGetCommunicationsFromDawa是一个异步函数。我已经从DAWA检查了AjaxGet市政设施，它正确加载了数据

我尝试使用数据更新我的选择列表，但似乎更新发生在市政用户加载之前。我也尝试过使loads异步，但最终还是得到了一个空的选项列表

请帮忙

HTML代码：

<div class="row mt-3 fw-bold">
    <div class="col-3"><label asp-for="PostalAddress_Municipality">Municipality:</label></div>
    <div class="col-9">
        <select asp-for="PostalAddress_MunicipalityId" class="form-control form-control-sm" name="municipality"></select>
    </div>
</div>

两件事，不回一个承诺。所以等待发送只是等待一个空的微任务完成，而不是实际的请求。您需要做的是将请求包装成一个承诺，该承诺将由异步FSM处理。您还需要实际调用loadcitizes，以便实际填充列表。下面是一个工作示例

var市政当局=来自达瓦的AjaxGet市政当局； 异步函数ajaxGet市政设施fromdawa{ var输出=[]； var xHttp=新的XMLHttpRequest； 返回新PromiseSolve=>{ xHttp.onreadystatechange=函数{ 如果this.readyState==4&&this.status==200{ var dawaData=JSON.parsethis.responseText； dawaData.forEachfunctiondata{ 输出推送{ Id:data.kode， 名称：data.navn， CountryId:53， 国家文字：丹麦， RegionId:data.regionskode， RegionText:data.region.navn }; }; 解析输出； } } xHttp.openGET，https://dawa.aws.dk/kommuner符合事实的 xHttp.send； }; } 异步函数加载{ var select=document.queryselector； var数据=等待市政当局； data.ForeachFunction自治市{ var option=document.createElementoption； option.value=市政当局.Id； option.text=市政当局.Name； option.selected=select.value==communicity.Id； 选择.addoption； }; } 各市镇；

---

谢谢。我最近一直在用C语言工作，完全忘记了javascript中的承诺。

    var Municipalities = ajaxGetMunicipalitiesFromDAWA();
    
async function ajaxGetMunicipalitiesFromDAWA() {
    var output = [];
    var xHttp = new XMLHttpRequest();
    xHttp.onreadystatechange = function () {
        if (this.readyState == 4 && this.status == 200) {
            var dawaData = JSON.parse(this.responseText);
            dawaData.forEach(function (data) {
                output.push({ Id: data.kode, Name: data.navn, CountryId: 53, CountryText: "Danmark", RegionId: data.regionskode, RegionText: data.region.navn });
            });
        }
    }
    xHttp.open("GET", "https://dawa.aws.dk/kommuner", true);
    await xHttp.send();
    return output;
}

async function loadMunicipalities() {
    var select = document.querySelector("municipality");
    var data = await Municipalities;
    data.forEach(function (municipality) {
        var option = document.createElement("option");
        option.value = municipality.Id;
        option.text = municipality.Name;
        option.selected = select.value == municipality.Id;
        select.add(option);
    });
}