javascript - 我如何知道在选择框中选择了哪个对象，或者是否可以将对象绑定(bind)到 KnockoutJS View 模型？

Question

我有一个已绑定(bind)到 select HTML 元素的对象数组。当用户更改 select 元素上的选项时，我可以将该值绑定(bind)到 KnockoutJS View 模型。但是，我需要将此值映射回原始 JavaScript 对象(因为我需要访问其他属性来执行其他逻辑)。

我的 HTML 看起来像这样。

<select data-bind="options: categories, 
    optionsText: 'name',
    optionsValue: 'id',
    value: selectedCategory,
    optionsCaption: 'Choose...',
    event: { change: categoryChanged }
    ">
</select>

我的 JavaScript 如下所示。

var categories = [
    { "name" : "color", "id": "1" },
    { "name" : "names", "id": "2" }
];
var Category = function(data) {
    this.name = ko.observable(data.name);
    this.id =  ko.observable(data.id);
};
var Value = function(data) {
    this.name = ko.observable(data.name);
}
var ViewModel = function(categories, values) {
    var self = this;
    self.categories = ko.observableArray(ko.utils.arrayMap(categories, function(category) {
        return new Category(category);
    }));
    self.selectedCategory = ko.observable();
    self.categoryChanged = function(obj, event) {
        //how do i map back to which category was selected?
        //do i have to loop through?
    };
};
var viewModel;
$(document).ready(function() { 
    viewModel = new ViewModel(categories);
    ko.applyBindings(viewModel);
});

JSFiddle 代码位于 http://jsfiddle.net/jwayne2978/sx4e2f0r/ 。

当用户更改选择时，我可以通过 self.selectedCategory 访问选择的类别 ID，但我现在需要将此类别 ID 映射回实际的 Category 。我想我可以迭代 self.categories，但这似乎有点违背 KO 的目的。

有什么方法可以将整个对象绑定(bind)到 View 模型吗？

Answer 1

您是否尝试过删除 optionsValue: 'id'？然后，您将绑定(bind)到可观察对象本身，而不仅仅是 id 属性。