KnockoutJS 映射，来自 WebAPI 的 JSON

Question

我可以使用以下代码将从 .net WebAPI 返回的 JSON 绑定到淘汰视图模型。

function viewModel() {
    var self = this;
    self.temps = ko.observableArray([]);
}

$(function () { 
    var model = new viewModel();

    $.get('../api/Temp/', function (data) { 
        model.temps(data);
    });

    ko.applyBindings(model);       

});

当我尝试使用 Ryan Niemeyer 's mapping example 时，我在返回的 Json 上使用 ko.utils.parseJson 时得到空值，而当我尝试直接使用 ko.utils.arrayMap 时，我得到未定义。

如果我尝试以下操作，我也很难将 get 请求放入单独的函数中，我的数据绑定停止工作

function dataFromServer() {
    $.get('../api/Temp/', function (data) { 
        return data;
    });
}

$(function () { 
    var model = new viewModel();
    var data = dataFromServer();
    model.temps(data);

    ko.applyBindings(model);       

});

从服务器返回的 JSON：

[{"Id":1,"Name":"Test1","TypeId":100,"Temp":21.0,"Peak":true},{"Id":2,"Name":"Test2","TypeId":100,"Temp":21.0,"Peak":true},{"Id":3,"Name":"Test3","TypeId":101,"Temp":21.0,"Peak":true}]

Answer 1

您的 AJAX 调用是异步的，因此它不会立即从您的函数返回您的数据：

$.get('../api/Temp/', function (data) { 
        return data;
    });

您可能希望将要写入结果的 observable/observableArray 传递到您的函数中，例如：

function dataFromServer(temps) {
    $.get('../api/Temp/', function (data) { 
        return temps(data);
    });
}

然后这样称呼它：

var model = new viewModel();
dataFromServer(model.temps);