无法处理绑定，请使用 ko.mapping.fromJS 将 JSON 数据推送到 ObservableArray

Unable to process binding, push JSON data to ObservableArray using ko.mapping.fromJS

本文关键字：数据 JSON ObservableArray fromJS mapping 处理 绑定 ko 请使用      更新时间：2023-09-26

谁能解释一下我的代码出了什么问题，我是淘汰赛的新手......因此，最初我从数据库中接收json数据并且它可以工作。比当我单击"添加一些"时，我想将相同的数据从数据库添加(推送(到我的可观察数组。下面的代码显然不起作用。谢谢。错误：无法处理绑定"文本：函数 (({返回 AdId }"...

.HTML： 

<div data-bind="foreach: Ads">     
    <p data-bind="text: AdId"></p>         
</div>
<div data-bind="click: addSome">Add some</div>

型：

function AdListModel() {
var self = this;
self.Ads = ko.mapping.fromJS([]);
self.result = function (model) {
    ko.mapping.fromJS(model, self.Ads);
}    
self.InitialData = function () {
    $.ajax({
        type: "GET",
        url: '/Home/GetAllAds',
        data: { startPosition: 0, numberOfItems: 2 },
        dataType: "json",
        success: function (data) {
            self.result(data); <---- works
        }
    });
}
self.addSome = function () {
    $.ajax({
        type: "GET",
        url: '/Home/GetAllAds',
        data: { startPosition: 0, numberOfItems: 2 },
        dataType: "json",
        success: function (data) {
            self.Ads.push(data); <---- doesn't work

        },
    });
};
self.InitialData();
}
ko.applyBindings(new AdListModel());

我试过self.Ads.push(ko.mapping.fromJS(data)) - 没有用。

从错误消息来看，您的model没有AdId属性。

是否可以添加 API 返回的 JSON 模型的转储？

编辑

您的Ads属性应该是ko.observableArray()而不是ko.mapping.fromJS([])：

function AdListModel() {
    var self = this;
    self.Ads = ko.observableArray([]);
    self.result = function (model) {
        ko.mapping.fromJS(model, self.Ads);
    }

编辑 2

您必须在推送数据之前映射数据：

$.ajax({
    type: "GET",
    url: '/Home/GetAllAds',
    data: { startPosition: 0, numberOfItems: 2 },
    dataType: "json",
    success: function (data) {
        self.Ads.push(ko.mapping.fromJS(data));
    },
});

编辑 3

如果您的 JSON 如下所示：

[
    {"AdId":1,"AdContent":"test1"},
    {"AdId":2,"AdContent":"test2"}
]

然后它是一个数组，你必须遍历每个条目：

$.ajax({
    type: "GET",
    url: '/Home/GetAllAds',
    data: { startPosition: 0, numberOfItems: 2 },
    dataType: "json",
    success: function (data) {
        data.forEach(function(d) {
            self.Ads.push(ko.mapping.fromJS(d));
        });
    },
});
相关文章：