当我使用for循环时，JSRender/JSView重复所有模板 [英] JSRender/JSView repeat all template when I use for loop

问题描述

我有一个具有以下格式的数组:

I have an array with this format:

{[
{ title : "", artist : "" },
{ title : "", artist : "" },
{ title : "", artist : "" },
{ title : "", artist : "" }
]}

当我尝试打印数据时，我得到了完整的模板n次(Json数据长度).我有:

When I try print the data, I get the full template n times (Json data lenght). I have:

var list = new Array();
list.push({ title : **data**, artist : **data** });
var songsTemplate = $.templates("#topSongsTemplate");
var html = songsTemplate.render(list);
$("#topSongs").html(html);

我只希望模板的for重复.但是我在整个div上一直重复得到完整的模板.我想念什么吗?:

I only want the for of my template repeats. But I get the full template all times repeated across my div. I am missing something?:

<script type="text/x-jsrender" id="topSongsTemplate">
    <div class="col-md-6">
        <i class="fa fa-trophy"></i> <span data-i18n="search.top_tracks">Top 20 Tracks</span>
        <div class="separator hr-line-dashed m-t-xs"></div>
        <ol>
            {{for ~root }}
                <li>{{>title}} - <small>{{>artist}}</small></li>
            {{/for}}
        </ol>
    </div>
    </script>

推荐答案

要进行渲染而不进行迭代，您可以编写:

To render without iteration you can write:

var html = songsTemplate.render(list, true);

请参见将数组传递给render()，但无需迭代.在此文档主题.

顺便说一句，您也可以写{{for}}或{{for #data}}-尽管{{for ~root}}也可以.

BTW then you can equally write {{for}} or {{for #data}} - though {{for ~root}} will also work.

也请查看此答案(针对类似问题).

Also take a look at this answer to a similar question.

这篇关于当我使用for循环时，JSRender/JSView重复所有模板的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！