knockout.js 未正确设置选择选项

Question

也许我误解了它是如何工作的。我想使用 knockout.js 来填充选择元素选项。我正在使用以下标记来实现这一点：

<select data-bind="options: type_options, optionsText: function(item) {
            return item.text;
        }, optionsValue: function(item) {
            return item.value;
        }, optionsCaption:'Select a type...',
        value: type">

以下是相关型号代码：

 var myModel = {
    type: ko.observable(),

    type_options: ko.observableArray([
        {text: "String 1", value:1},
        {text: "String 2", value:2},
        {text: "String 3", value: 3},
        {text: "String 4", value: 4},
        {text: "String 5", value: 5}
    ]),
 }

现在下拉列表正确呈现，所有正确的文本和值，但是当我从下拉列表中选择一个选项时，它没有正确设置“类型”的值。

例如，如果我选择了标记为“String 4”的选项，并在浏览器中运行以下命令：

myModel.type()

我希望它返回值“4”。相反，我得到了整个对象：

Object
     text: "String 4"
     value: 4
     __proto__: Object

我的问题是如何根据选项的 value 属性而不是整个对象来设置类型的值？

Answer 1

好吧，您应该能够在选项数组中传递变量的文本，而不是函数。我不知道这是否是导致问题的原因，但您的标记看起来会更好

<select data-bind="options: type_options, optionsText: 'text', optionsValue: 'value', optionsCaption:'Select a type...', value: type"></select>

这应该可以满足您的需求，完整示例请参见 fiddle。