Isotope和Knockout js无法删除动态添加的元素

Question

我一直试图让Isotopejs和Knockoutjs一起工作.所以,它一直在游泳,除了我需要在dom中添加元素然后需要删除它们.

我已将问题追溯到此方法内部:ko.utils.setDomNodeChildrenFromArrayMapping = function(domNode,array,mapping,options,callbackAfterAddingNodes){..}

这是调用此方法fixUpVirtualElements(lastMappingResult [lastMappingResultIndex] .domNodes);

fixUpVirtualElements方法正在删除我需要在beforeRemove事件中删除w /同位素的dom节点; foreach绑定调用没有获取需要删除的元素.

我已经在淘汰赛中阅读了该方法的注释..但我不明白它们的意思,因为我对它的讨论没有任何领域知识.

任何人都可以看看我最新的jsfiddle,让我知道为什么fixUpVirutalElements正在删除我需要传递给beforeRemove事件的元素.

http://jsfiddle.net/evanlarsen/C5y6G/

有人可以修复这个jsFiddle让2个图书馆一起工作.

谢谢,Evan Larsen

Answer 1

我不是同位素专家; 我知道它的作用但是我不知道它的算法,但我对knockout.js的来源有一些不确定的知识.现在可能的问题是同位素操纵由敲除模板绑定创建的dom节点.knockout.js不允许其他程序触及模板创建的DOM节点.所有knockout.js算法都假设模板创建的dom节点改变的唯一方法是操纵绑定到模板的数组.如果其他东西直接操纵那个节点,无论是通过添加节点,删除节点还是(如同位素的情况下)重新排序它们.所有淘汰js算法都会疯狂...这意味着删除的节点不会消失,某些节点会重复...等等.

------------------------更新----------------

解决了只是替代:

self.serviceAdded = function(el) {
        if (el && el.nodeType === 1) {
           $('#container').isotope('insert', $(el)); 

        }
    };

有:

self.serviceAdded = function(el) {
        if (el && el.nodeType === 1) {
           $('#container').isotope('appended', $(el)); 

        }
    };