knockout.js - 选定的选项 ID 和值

Question

通常，当我有一个选择列表时，我会将其与 knockout 绑定(bind)，如下所示:

<select
    data-bind="
        options: data,
        optionsText: 'Name',
        optionsValue: 'Id',
        optionsCaption: 'Select ...',
        value: dataSelectedId" ></select>

但是这种绑定(bind)存在一个问题:您没有选定的对象。你有它的 ID。 如何合并这两个要求:绑定(bind)到项目的 id 和项目本身？

现在我用 computed可观察到获取选定项目，通常如下所示:

self.dataSelectedCO = ko.computed(function() {
    for (var i = 0; i < self.data().length; ++i)
        if (self.data()[i].Id() == self.dataSelectedId())
            return self.data()[i];
});

I've tried to wrap value getter using a custom function but it's called for every element when selection changes, so there are no benefits here of using this approach. Here是一个jsfiddle。

Answer 1

删除 optionsValue范围。那么选定的值将是“选定项”而不是 Id .

更新后的代码将是:

<select
    data-bind="
    options: data,
    optionsText: 'Name',
    optionsCaption: 'Select ...',
    value: dataSelectedItem" ></select>

dataSelectedItem现在将具有选定的项目。

一旦你有了这个项目。你可以得到 Id来自对象本身，例如 dataSelectedItem().Id