Knockout.js - 似乎没有正确绑定,无法弄清楚原因

时间:2016-08-10 09:59:43

标签: asp.net knockout.js

我确定这是一个简单的解决办法,但我正在破坏我的大脑试图解决这个问题。

以下是代码的主要部分。

JS

//Viewmodel
var PurchaseOrderModel = function () {
    var self = this;

    self.OrderNumber = ko.observable();
    self.Description = ko.observable();

    self.GetPurchaseOrder = function(Id) {
        //
        $.ajax({
            type: "GET",
            url: 'URL' + Id,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (data) {
                self.OrderNumber = ko.observable(data.OrderNumber);
                self.Description = ko.observable(data.Description);
            },
            error: function (err) {
                alert(err.status + " : " + err.statusText);
            }
        });
    }
}

//DOM Loaded
$(document).ready(function () {
    var po = new PurchaseOrderModel();
    ko.applyBindings(po);

    po.GetPurchaseOrder(124028);
});

HTML

<div>
    <input id="test" type="text" data-bind="value: OrderNumber">
    <input type="text" data-bind="value: Description">

    <p type="text" data-bind="text: OrderNumber"></p>
</div>

控制器

return Json(new
    {
        OrderNumber = model.OrderNumber,
        Description = model.Description
    }, JsonRequestBehavior.AllowGet);

这是我在检查器网络标签中看到的

{"OrderNumber":115548,"Description":"Test"}

因此,数据正在返回,我只是想知道为什么用户界面没有正确捕捉/绑定。

非常感谢任何见解!

1 个答案:

答案 0 :(得分:2)

不要像你在这里那样用新的替代品替换旧的observable:

success: function (data) {
  self.OrderNumber = ko.observable(data.OrderNumber);
  self.Description = ko.observable(data.Description);
}

您必须设置您已使用新值定义的observable,如下所示:

success: function (data) {
  self.OrderNumber(data.OrderNumber);
  self.Description(data.Description);
}