Question

我使用映射插件来更新视图模型，如下所示：

        $.ajax({
            type: "POST",
            url: url,
            data: data,
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (json) {
                if (json.Page == 1) {
                    ko.mapping.fromJS(json, {}, self);
                } else {
                    self.List().push(ko.mapping.fromJS(json.List));
                }
                console.log(ko.toJSON(self.List()));
            },
        });

然而，不是更新List（）可观察数组（在ajax调用完成时仅添加NEW项目 - 对于第2页（来自DB的下一个项目），它会添加一个新的List =＆gt;注意＆＃34; [＆＃ 34;控制台输出中的元素：

AJAX响应（json）

{＆＃34; DiscountType＆＃34;：＆＃34;事务处理＆＃34;＆＃34;列表＆＃34;：[{＆＃34; ActivationDate＆＃34;：＆＃34; /日期（1427215761818 ）/＆＃34;，＆＃34;客户名称＆＃34;：＆＃34;另外两个2＆＃34;，＆＃34; CustomerNumber＆＃34;：4328，＆＃34;百分比＆＃34;：20，＆＃34; HasDiscount＆＃34;：真}，{＆＃34; ActivationDate＆＃34;：＆＃34; /日期（1428079761818）/＆＃34;＆＃34;客户名称＆＃34;：＆＃34;另一树＆＃34;＆＃34; CUSTOMERNUMBER＆＃34;：1212，＆＃34;百分比＆＃34;：20，＆＃34; HasDiscount＆＃34;：真}]，＆＃34;页＆＃34;：2 }

控制台输出：

[{＆＃34; ActivationDate＆＃34;：＆＃34; / Date（1388556000000）/＆＃34;，＆＃34; CustomerName＆＃34;：＆＃34; Test1 Inc.＆＃34;，＆＃34; CUSTOMERNUMBER＆＃34;：10032＆＃34;百分比＆＃34;：20，＆＃34; HasDiscount＆＃34;：真}，{＆＃34; ActivationDate＆＃34;：＆＃34; /日期（1426783761818）/＆＃34;，＆＃34;客户名称＆＃34;：＆＃34;另一个1＆＃34;，＆＃34; CustomerNumber＆＃34;：5174，＆＃34;百分比＆＃34;：20 ＆＃34; HasDiscount＆＃34;：真}，[{＆＃34; ActivationDate＆＃34;：＆＃34; /日期（1427215761818）/＆＃34;＆＃34;客户名称＆＃34;：＆＃ 34;另外两个2＆＃34;，＆＃34; CustomerNumber＆＃34;：4328，＆＃34;百分比＆＃34;：20，＆＃34; HasDiscount＆＃34;：true}，{＆＃34; ActivationDate＆＃ 34;：＆＃34; /日期（1428079761818）/＆＃34;，＆＃34;客户名称＆＃34;：＆＃34;另一棵树＆＃34;，＆＃34; CustomerNumber＆＃34;：1212，＆＃ 34;百分比＆＃34;：20，＆＃34; HasDiscount＆＃34;：真}]]

我做错了什么？

Answer 1

要推送返回数组的各个元素，请执行类似

的操作

success: function (json) {
    if (json.Page == 1) {
        ko.mapping.fromJS(json, {}, self);
    }
    else {
        json.List.forEach( 
            function(element) {
               self.List.push( ko.mapping.fromJS(element) );
            } );
        }
    console.log(ko.toJSON(self.List()));
        }

var vm = function() {
  var self = this;
  self.List = ko.observableArray([]);
  self.initiate = function() {
    json = JSON.parse('{"DiscountType":"Transaction","List":[{"ActivationDate":"/Date(1427215761818)/","CustomerName":"Another two 2","CustomerNumber":4328,"Percent":20,"HasDiscount":true},{"ActivationDate":"/Date(1428079761818)/","CustomerName":"Another tree","CustomerNumber":1212,"Percent":20,"HasDiscount":true}],"Page":2}');
    json.List.forEach(function(entry) {
      self.List.push(ko.mapping.fromJS(entry));
    });
  };
};
vm = new vm();
ko.applyBindings(vm);
vm.initiate();

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.2.0/knockout-min.js"></script>

<script src='https://cdnjs.cloudflare.com/ajax/libs/knockout.mapping/2.4.1/knockout.mapping.min.js'></script>
<html>

<div data-bind='foreach: List'>
  <div data-bind='text: ActivationDate'></div>
</div>

</html>

Knockout将新行添加到映射插件列表中

1 个答案: