1

我正在使用 Knockout 2.2.1 将对象绑定到下拉列表。绑定用于将正确的项目放入列表中,但是当我尝试选择 OBJECT 时,它不起作用。我有一个显示这个问题的 JSFiddle;http://jsfiddle.net/CTBSTerry/g4Gex/

Html
<div style="margin-bottom: 15px;">
   Your Choices: 
   <select data-bind="options: choicelists[0].options, optionsText: 'otext', optionsValue: 'oprice', value: selOpt1, optionsCaption: 'Choose...'"></select>
</div>
<div data-bind="visible: selOpt1" style="margin-bottom: 15px;"> <!-- Appears when you select something -->
    You have chosen<br> 
    From Object:&nbsp;
    <span data-bind="text: selOpt1() ? selOpt1().otext : 'unknown'"></span>
    <br>From Value:&nbsp;
    <span data-bind="text: selOpt1() ? selOpt1() : 'unknown'"></span>
</div>
 JavaScript:
var mychoice = function (txt, price) {
        this.otext = txt;
        this.oprice = price;
    }
    var viewModel = {
        prodphoto: "",
        prodname: "",
        prodDesc: "",
        baseprice: "",
        choicelists: [
        { 'listlabel': 'Size List',
            'options': ko.observableArray([
            new mychoice('Small', 'Small|$|0.00'),
            new mychoice('Medium', 'Medium|$|0.00'),
            new mychoice('Large', 'Large|$|0.00'),
            new mychoice('X Large + 2.00', 'X Large|$|2.00'),
            ])
        }],
        textlists: [],
        selOpt1: ko.observable()
    }


    ko.applyBindings(viewModel);

当您单击下拉列表进行选择时,我有 2 个跨度尝试显示我想要的选定值作为选定对象,而不仅仅是特定值字段。对象表示法不返回任何内容,但不会出错。第二个跨度显示选定的值,但由于它不是选定的对象,我将不得不遍历对象以获取相关对象。Knockout 文档显示了一个非常相似的示例,但我需要一个更复杂的视图模型。有人可以帮助我并指出为什么这不起作用吗?

谢谢,特里

4

1 回答 1

1

如果optionsValue从绑定中删除,则 Knockout 将使用实际对象而不是其上的属性。

因此,您希望optionsValue: 'oprice'从绑定中删除,然后selOpt1将填充实际对象。

示例:http: //jsfiddle.net/rniemeyer/g4Gex/1/

于 2013-05-29T21:49:00.870 回答