用mapping.fromJS和template击倒js

Knockoutjs with mapping.fromJS and template

本文关键字：击倒 js template mapping fromJS      更新时间：2023-09-26

我已经用模型中的每个条目更新了一个表，并且在删除和添加数组时触发了两个事件。hideElement调用jquery的"fadeOut"，而showElement调用jquery的"fadeIn"函数来创建一个漂亮的渐出/渐入效果。

<tbody  data-bind='template: { foreach: entries,
     beforeRemove: hideElement,
     afterAdd: showElement }'>

我的模型是这样的:

var Model = function() {
self.entries = ko.mapping.fromJS([]);
this.getData = function() {
$.ajax({
    url: "/test",
    type: "GET",
    success: function(response) {
        ko.mapping.fromJS(response, self.entries);
...
this.showElement = function(elem) { 
    if(elem.nodeName == "TR") {
         $(elem).fadeIn(500);
    }
};
this.hideElement = function(elem) { 
    if(elem.nodeName == "TR") {
       $(elem).fadeOut(500);
    };
};
...

问题是，每次在ajax响应中调用ko.mapping.fromJS(response, self.entries)时，即使它们完全相同，似乎也会删除/添加条目。因为，showElement/hideElement被调用，元素在我的表是"闪烁"，因为他们被删除/添加每次ajax调用。

它应该是这样的还是我用错了?

您需要在映射插件中使用key选项，以便插件知道哪些项是相同的

http://jsfiddle.net/yWwfz/

var mapping =  {
    items: {
        key: function(item) { return item.id; }
    }
};
ko.mapping.fromJS(data, mapping, this);
相关文章：