Question

我正在使用带有Knockout的jQuery模板，出于某种原因，在使用foreach时，被神奇地插入到每个项目之间。这是为什么？我该如何摆脱它？

<ol data-bind='template: { name: "list_item_template", foreach: showable }'></ol>

<script type="text/html" id="list_item_template">
    <li class="listItem clearfix" id="list_item_${id}">
         ${title}
    </li>
</script>

这导致：

<ol data-bind='template: { name: "list_item_template", foreach: showable }'>
 <!---->
 <li class="listItem clearfix" id="list_item_301">Stuff</li> 
 <!---->
 <li class="listItem clearfix" id="list_item_302">Stuff</li> 
 <!---->
 <li class="listItem clearfix" id="list_item_303">Stuff</li> 
 <!---->
 <li class="listItem clearfix" id="list_item_304">Stuff</li>  
</ol>

由于

Answer 1

一些想法：（1）您确认使用的是最新版本的jquery.tmpl.js吗？

https://raw.github.com/jquery/jquery-tmpl/master/jquery.tmpl.js

我认为你的viewModel工作正常吗？这是我在本地测试中使用的viewmodel。我猜你的看起来很相似吗？

var vm = {
    showable: ko.observableArray([
        { id: 0, title: 'foo' },
        { id: 1, title: 'bar' },
        { id: 2, title: 'baz' },
        { id: 3, title: 'bam' }
        ])
};

（2）顺便说一句，我的理解是Knockout很快将用jsRender替换jquery.tmpl，所以希望你不要太依赖.tmpl：

https://github.com/BorisMoore/jsrender

（3）作为一种解决方法，您是否考虑过使用knockout替换模板的使用？这将删除您对jquery.tmpl的依赖。所以你的模板看起来像：

<script type="text/html" id="list_item_template">
    <li data-bind="text:title, attr:{id:'list_item_'+id}" class="listItem clearfix" ></li>
</script>

Answer 2

我对你的问题没有直接的答案，但我有潜在的解决方法。

我不知道为什么jQuery tmpl会为每个项目注入评论。但是，我怀疑它是否真的是jQuery Tmpl注入注释而不是KnockoutJS。要进行验证，请尝试使用不带KnockoutJS的模板，查看HTML注释是否仍然显示。

最后，请注意最新版本的Knockout (1.3 beta)有自己的本机模板引擎;您可以通过使用本机模板引擎来解决此问题。

jQuery模板在每个foreach项上注入<！---->？为什么？

2 个答案: