Question

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

我有一个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

有两个原因：

因为ajax回调中的this不是您的viewmodel。如果您愿意，请使用bind
因为您正在用原始属性替换您的observable。而是设置可观察的值

所以：

    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

Re＃2，我建议通过Knockout tutorials，因为这是KO最基本的方面之一。

附注：不要使用eval来解析JSON。使用JSON.parse解析JSON。或$.parseJSON。

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

1 个答案: