knockoutmvc -无法解析绑定

Question

我有一个knockout-mvc站点，我正在尝试让knockout- MVC能够使用它。

我在C#代码中创建了一个名为Refund的视图模型，其中包含一个名为Voucher Voucher的类型和一个名为Countries的List<Country>。Voucher有一个名为VoucherNumber的int类型的变量

此视图模型被传递到一个强定义的视图Refund\Index中

我正在尝试让knockout-mvc将Refund.Voucher.VoucherNumber中的值绑定到文本框，并将Refund.Countries中的值绑定到下拉列表。在控制器上，我对Voucher.Vouchernumber的值进行了硬编码，并将两个国家添加到了国家列表中。

以下是我的视图代码：

@using Resources
@using PerpetuumSoft.Knockout
@model MVC.Models.RefundViewModel
@{
    var ko = Html.CreateKnockoutContext();
}

<div id="refundformcontainer">
    <div id="headersection">
        <div id="pagetitlecontainer">@Language.RefundVouchers</div>
        <div id="helpercontainer">
            <label id="lblhelper">To begin enter a voucher number or scan a barcode</label>
        </div>
    </div>

    <div id="vouchercontainer">
        <div id="voucherdetailscontainer">
            <h5>@Language.VoucherDetails</h5>
            <div id="vouchernumbercontainer" class="initialvoucherfield">
                @Html.LabelFor(x=>x.Voucher.VoucherNumber)
                @ko.Html.TextBox(x=>x.Voucher.VoucherNumber)
            </div>
            <div id="countrycontainer" class="initialvoucherfield">
                @Html.LabelFor(x=>x.Voucher.Country)
                <select ko.Bind.Options(x=>x.Countries).OptionsText("Name").OptionsValue("CountryId").Value(x=>x.Voucher.CountryId) ></select>
            </div>
        </div>
    </div>
</div>
@ko.Apply(Model);

加载页面时，这两个控件都不绑定到。

当我查看生成的源代码时，生成了以下代码

<script type="text/javascript">
    var viewModelJs = {"Refund":null,"Voucher":{"VoucherId":0,"VoucherNumber":123456789,"Country":null,"CountryId":0,"Retailer":null,"RetailerId":0,"PurchaseDate":"0001-01-01T00:00:00","CustomsStampDate":null,"InvoiceNumber":"","LineItems":[],"TotalPurchasePrice":0.0},"Countries":[{"CountryId":380,"Name":"Italy"},{"CountryId":724,"Name":"Spain"}]};
    var viewModel = ko.mapping.fromJS(viewModelJs);
    ko.applyBindings(viewModel);
</script> 

knockout-2.2.0.js和knockout.mapping-latest.js都包含在页面中

我得到的错误是

0x800a139e - JavaScript runtine error: Unable to parse bindings
Message: [Object Error]
Bindings value: Voucher().VoucherNumber

然后，我更改了退款视图模型，使其具有属性VoucherNumber，并让textbox引用此属性，而不是Voucher.VoucherNumber属性

@ko.Html.TextBox(x=>x.VoucherNumber)

当我运行这个程序时，我得到了同样的unable to parse bindings错误，但这次是针对国家/地区的

Bindings value: options : Countries, optonsText : Name, optionsValue : CountryId

有人知道这是什么原因吗？

Answer 1

我想，这应该行得通。

<select @ko.Bind.Options(x=>x.Countries).OptionsText("'Name'").OptionsValue("'CountryId'").Value(x=>x.Voucher.CountryId) ></select>