淘汰赛：在加载时使用 ajax 加载可观察数组

Question

我在将所选选项绑定回下拉菜单时遇到问题

这是我的代码：

@Html.SelectListFor(m => m.State,
new { data_bind = "options: availableStates,  optionsText: 'Name', 
                   optionsValue: 'Id', selectedOptions: selectedStates
    })

在我的页面加载时，我想在这个下拉列表中设置我的选项，所以我有以下淘汰代码：

 $.ajax({
            url: rootDir + "/Home/GetStates",
            type: "GET",                
            contentType: "application/json",
            success: function (data) {
                var jsonResult1 = JSON.parse(data);                    
                data1 = jsonResult1;
                for (key in jsonResult1) {
                    var item = {
                        Id: jsonResult1[key].Id,
                        Name: jsonResult1[key].Name
                    };
                    self.availableStates.push(item);
                }
            }
       });

  self.selectedStates = ko.observableArray(vmData.State || "");
  //vmData.State has the previous selected values from the db 

我的问题是当我调试上面的代码时，上面的 ajax 调用在最后执行，而 selectedStates 语句在之前执行。由于之后执行 ajax 调用，因此下拉列表为空，并且下拉列表中没有任何设置。

我可以直接将上面的 ajax 代码放在我的淘汰赛 js 文件中并加载 availablestates 可观察数组吗？

Answer 1

您可以在视图模型中创建一个公共方法来处理 ajax 调用和推送到可观察的可用状态。当你实例化你的虚拟机时，你可以在 applyBindings 之前调用这个方法。

编辑：可能是错字，但仍然：

@Html.SelectListFor(m => m.State,
new { data-bind = "options: availableStates,  optionsText: 'Name', 
                   optionsValue: 'Id', selectedOptions: selectedStates
    })

数据绑定不是数据绑定