knockout.mapping下拉列表，获取选定值

knockout.mapping drop down list, get selected value

本文关键字：获取 mapping 下拉列表 knockout      更新时间：2023-09-26

我在理解如何获得我使用knockout.mapping绑定的选择（下拉）列表的selectedValue时遇到了问题。

以下是ajax调用和映射：

 var EmailCollection;
 function GetAllEmailsAjax() {
            $.ajax({
                url: "http://localhost:54756/api/Email",
                type: "GET",
                dataType: "JSON",
                success: function (data) {
                    GetAllEmails(data);
                }
            });            
        }
        function GetAllEmails(data) {
            // not sure if this is 100% correct but it does seem to work as expected
            if (!EmailCollection) {
                EmailCollection = ko.mapping.fromJS(data);
            }
            ko.mapping.fromJS(data, EmailCollection);
            ko.applyBindings(EmailCollection);
        }
<select data-bind="options: EmailCollection, optionsText: 'Name', optionsValue: 'Id', optionsCaption: 'Choose...'"></select>

据我所知，我需要在select数据绑定属性中指定值。所以它应该是这样的：

然而，这意味着selectedEmail需要成为我的模型的一部分。然而，由于所有这些都是由knockout.mapping创建的，我不确定我是如何做到的。我假设了一些类似以下的模型，但我不确定如何进行。

var EmailViewModel = {
   selectedEmail : ko.Observable(),
   Emails : EmailCollection // the previous model mapped bound in a scenario like this
};
// EmailViewModel.selectedEmail() would then contain my selected value..

我相信，一旦我在纸上看到它，就在我努力解决的那一刻，一切都会变得显而易见。

如果只选择一封电子邮件（由于您使用的是下拉列表，因此这是隐含的），则应创建一个变量来保存所选的电子邮件id。如果它默认为集合中的第一封电子邮件，则应执行以下操作：

var selectedEmailId: ko.observable();
...
function GetAllEmails(data) {
...
ko.mapping.fromJS(data, EmailCollection);
selectedEmailId(EmailCollection.peek().Id); //Assuming EmailCollection is an array
ko.applyBindings(EmailCollection);
}
<select data-bind="options: EmailCollection, optionsText: 'Name', optionsValue: 'Id',
    optionsCaption: 'Choose...', value: selectedEmailId"></select>

selectedEmailId应在下拉选择更改时随时更新。

相关文章：