我得到了一个JSON/Javascript对象，因为我可以在控制台中看到它，但我如何让它序列化并使我的数据绑定到我的Ui

I am getting a JSON/Javascript object because I can see it in my console, but how do I get it to serialize and make my data bind to my Ui elements?

本文关键字：我的 数据绑定 Ui 控制台 序列化 我可以 一个 对象 因为 Javascript JSON      更新时间：2023-09-26

我正在使用淘汰。我将动态数据从MySql服务器发送到wcf服务，然后使用敲除函数在div中显示数据。我会在下面发布代码，这样你就可以看到我在说什么了。

我的淘汰模型：

function machineDataModel(item) {
    this.mach_no = ko.observable(item.mach_no),
    this.VAR1 = ko.observable(item.VAR1),
    this.VAR2 = ko.observable(item.VAR2),
    this.VAR3 = ko.observable(item.VAR3),
    this.VAR4 = ko.observable(item.VAR4)
};

淘汰赛视图模型：

$(document).ready(function () {
    var machineDataViewModel = {
        machineDataItems: ko.observableArray([]),
        loadMachineDataItems: function () {
            alert('Method 1: Start');
            $.getJSON("http://localhost/JsonRestful/Service1.svc/GetMachineData", function (data) {
                alert(data);
                console.log(data);
                //machineDataViewModel.machineDataItems.removeAll();
                //alert('Everything Removed')
                alert('Method 2: Start');
                $.each(data, function (index, item) {
                    machineDataViewModel.machineDataItems.push(new machineDataModel(item));
                });
            });
        }
    };
    ko.applyBindings(machineDataViewModel);
    machineDataViewModel.loadMachineDataItems();
    //setInterval( loadMachineDataItems, 10000 );
});

我知道一切都很好，直到我达到警戒状态方法2：开始。each方法并没有像我希望的那样迭代数组。我在控制台中获得了一个对象，我请求将其发布在日志中。Object { GetMachineDataResult=[20]}

我的观点是：

<div id="knockout" data-bind="foreach: machineDataItems">
    <p id="machineNum" data-bind="text: mach_no"></p>
    <div id="Completed" data-bind="text: VAR1"></div>
    <div id="Style" data-bind="text: VAR2"></div>
    <div id="PUPC" data-bind="text: VAR3"></div>
    <div id="RPM" data-bind="text: VAR4"></div>
</div>

从您在评论中发布的JSON响应的图像来看，您的JSON对象看起来像这样：

{
    "GetMachineDataResult": [ // bunch of items here ]
}

请注意，数组不是顶级对象，它是一个名为GetMachineDateResult的属性。所以不是：

$.each(data, function (index, item) { //...

您需要：

$.each(data.GetMachineDateResult, function (index, item) { //...

因为data是一个对象，而data.getMachineDateResult是您想要的数组。

相关文章：