Knockoutjs After Render 渲染 Html 注释

Question

我注意到 Knockout 的模板渲染中有一个奇怪的行为。

我有一个简单的 Knockout 示例...

var viewModel = {
    stuff : ko.observable([{ id : 1, name : 'Thing'},
        { id: 2, name : 'Thingier' },
        { id : 3, name : 'Thingiest' }]),
    render: function(el){
        console.log(el);
    }
}

$(function(){
    ko.applyBindings(viewModel);
});

和 ​​Html...

<ul data-bind="template: { name: 'thingTemplate',
                           foreach: stuff,
                           afterRender: render }">

</ul>
<!--
<script id="thingTemplate" type="text/html">
    <li>
        <span data-bind="text: name"></span>
    </li>
</script>-->

<script id="thingTemplate" type="text/html">
        <span data-bind="text: name"></span>
</script>

当使用当前注释掉的模板时调用渲染函数时，我得到 jQuery(li) 的 console.log。

当使用当前模板调用 reunder 函数时，我得到 jQuery(Comment { length=0, nodeName="#comment", nodeType=8, more...}, span) 的 console.log 。

那个评论节点是怎么回事？

这是工作小提琴... http://jsfiddle.net/jcreamer898/fqrv7/

Answer 1

我遇到了同样的问题，请参阅：
KnockoutJS 模板“beforeRemove”调用了 3 次而不是 1 次

我的解决方案如下（我知道不太好......）：

afterAdd: function(elem) {
     if (elem.nodeName == '#comment') { return; } // <-- This line

     try {
        jQuery(elem).hide().fadeIn(2000);
     } catch (e) {
       console.log(e);
     } 
}

Answer 2

根据 KnockoutJS 文档，将调用 afterRender 回调，传递“一个 DOM 数组”刚刚由模板渲染的节点。”换句话说，您的渲染回调应该需要一个节点数组。

现在，您的问题是为什么会看到评论元素回来。我的问题是，即使您删除了

，您是否会看到相同的评论元素？堵塞？