为什么我的数据绑定不起作用？

Question

我正在开发SharePoint 2010 Web部件。 我将使用敲除框架进行数据绑定。

我有一个使用此代码的ascx：

    <table>
        <tr>
            <td>
                <label id="lblLastMaintenanceDate">Data ultima manuntenzione:</label>
            </td>
            <td>
                <span id="lastMaintenanceDate" data-bind="text: lastMaintenanceDate"></span>
            </td>
        </tr>
        <tr>
            <td>
                <label id="lblMaintenanceDescription">Descrizione manuntenzione:</label>
            </td>
            <td>
                <span id="MaintenanceDescription" data-bind="text: maintenanceDescription"></span>
            </td>
        </tr>
        <tr>
            <td>
                <label id="lblConcept">Concept:</label>
            </td>
            <td>
                <span id="Concept" data-bind="text: concept"></span>
            </td>
        </tr>
    </table>

在document.ready（）内部，我编写了以下代码：

$(document).ready(function () {
    ko.applyBindings(ShopViewModel);
});

这是我的ViewModel：

var ShopViewModel = {
lastMaintenanceDate : ko.observable(),
maintenanceDescription : ko.observable(),
concept : ko.observable(),

GetShopDetail : function (val1) {

$.ajax({
        type: "GET",
        url: "../_layouts/MyProject/MasterPage.aspx/GetDetails?par1=" + val1,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        data: "{}",
        cache: false,
        async: false,
        success: function (result) {
            var oJson = eval("(" + result['d'] + ")");
            if (oJson.Success) {
                var result = oJson.Data;
                if (result) {
                    this.lastMaintenanceDate = String(result.LastMaintenanceDate);
                    this.maintenanceDescription = String(result.MaintenanceDescription);
                    this.concept = String(result.SyConceptId);
                }
            }
            else {
                WriteToConsole(oJson.Error);
                customAlert(oJson.Error, "Error");
            }
        }
    })
}

}

我用以下代码调用GetShopDetail函数：

ShopViewModel.GetShopDetail(val1);

我的问题是数据绑定不起作用。

你能帮助我吗？

谢谢

Answer 1

两个原因：

1. 因为this在Ajax回调中是不是你的视图模型。 如果您愿意，请使用bind

2. 因为您正在用原始属性替换可观测对象。 而是设置可观察值

所以：

    success: function (result) {
        var oJson = eval("(" + result['d'] + ")");
        if (oJson.Success) {
            var result = oJson.Data;
            if (result) {
                // ************** Change on next three lines
                this.lastMaintenanceDate(String(result.LastMaintenanceDate));
                this.maintenanceDescription(String(result.MaintenanceDescription));
                this.concept(String(result.SyConceptId));
            }
        }
        else {
            WriteToConsole(oJson.Error);
            customAlert(oJson.Error, "Error");
        }
    }.bind(this)     // <===== Change here

关于＃2，我建议完成Knockout教程 ，因为这是KO最基本的方面之一。

---

旁注：请勿使用eval解析JSON。 使用JSON.parse解析JSON。 或$.parseJSON 。