knockoutjs动画过渡更新元素

Question

模板上带有knockoutjs的动画过渡效果非常好，如果您要添加或删除一个形式为observableArray的元素。但我将如何捕捉更新。

目前用于更新项目我只是更换一个项目在数组中，像这样：

var index = arrayFirstIndexOf(self.documents(), function (item) { return item.id === doc.Id }); 
self.documents.replace(self.documents()[index], new Document(doc.Id, doc.Title, doc.Content)) 

动画化的转变会认为这是一个删除和插入。我将如何区分更新？

欢呼声，

Answer 1

所以这里使用自定义绑定

，而不要使用替代的解决方案：

var index = arrayFirstIndexOf(self.documents(), function (item) { return item.id === doc.Id }); 
self.documents()[index].title(doc.Title).content(doc.Content); 

这非常适用于一个简单的对象。但是更大的对象可能更适合使用映射插件。重点是，我不再替换数组项，因此“addAfter”和“beforeRemove”模板转换不会被触发。

标题和内容属性是可观察对象。因此，要处理数组项的更新的转变我使用自定义的结合，看起来像：

ko.bindingHandlers.highlightChange = { 
     origValue : null, 
     init: function (element, valueAccessor) { 
      origValue = valueAccessor(); 
     }, 
     update: function (element, valueAccessor) { 
      if (origValue !== valueAccessor()) 
      { 
       $(element).hide().fadeIn("slow"); 
      } 
     } 
    }; 

这则比较原值和反对更新。 如果有人有更好的解决方案，我会很感激你在这里发布。

欢呼声。