Question

我有一个绑定到select HTML元素的对象数组。当用户更改select元素上的选项时，我可以将值绑定到KnockoutJS视图模型。但是，我需要将此值映射回原始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的目的。

有没有办法将整个对象绑定到视图模型？

Answer 1

您是否尝试删除optionsValue: 'id'？然后，您将绑定到observable本身，而不仅仅是id属性。

如何知道在选择框中选择了哪个对象，或者是否可以将对象绑定到KnockoutJS视图模型？

1 个答案: