knockoutmvc - 无法解析绑定

时间:2013-08-02 11:31:10

标签: asp.net-mvc knockout.js knockout-mvc

我有一个ASP.NET MVC网站,我正试图让knockout-mvc使用它。

我在名为Refund的C#代码中创建了一个视图模型,其中包含名为Voucher类型的Voucher和名为List<Country>的{​​{1}} 。优惠券的变量类型为Countries,名为int

此视图模型将传递到强烈定义的视图VoucherNumber

我试图让knockout-mvc将Refund.Voucher.VoucherNumber中的值绑定到文本框,并将Refund\Index中的值绑定到下拉列表中。在控制器上,我已经硬编码了Voucher.Vouchernumber的值,并在国家列表中添加了两个国家。

这是我的观看代码:

Refund.Countries

页面加载时,两个控件都不绑定。

当我查看生成的源时,会生成以下代码

@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);

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

我得到的错误是

<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> 

然后我更改了退款视图模型,因此它有一个属性VoucherNumber并且文本框引用了这个而不是Voucher.VoucherNumber属性

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

当我运行这个时,我得到了相同的无法解析绑定错误,但这次是国家

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

有没有人知道造成这种情况的原因是什么?

1 个答案:

答案 0 :(得分:0)

我认为,这应该有用。

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