Question

HTML：

<div id="container"></div>

<script type="text/x-jquery-tmpl" id="tmpl">
  <div>{{=title}}</div>
  <div>
    {{#each cast}}
      {{#if $itemNumber == 1 }}{{=name}}{{else}}, {{=name}}{{/if}}        
    {{/each}}
  </div>
</script>

JS：

var json = [{ title: "Mission Impossible IV", cast: [ {name: "Tom Hanks"}, {name: "Jackie Chan"}, {name: "Tom Cruise"} ]}];

$("#container").html(
    $("#tmpl").render(json)
);

渲染为：

Mission Impossible IV
Tom Hanks , Jackie Chan , Tom Cruise

问题：请注意每个名称后面的空格。我在模板中没有空格，标签全部聚集在一起{{#if $itemNumber == 1 }}{{=name}}{{else}}, {{=name}}{{/if}}，因此，那些额外的空格不应该在那里。

问题关于这些额外空间是如何进入的任何想法？

您可以在此处进行调整：http://jsbin.com/otiqun/2/edit

Answer 1

{{/if}}和{{/each}}之间的换行符可能会被渲染为附加空格，因为HTML会将任意数量的连续空白字符压缩到一个空格中。尝试删除任何不必要的换行符，看看它是否解决了问题。

jsRender - 每个循环中的额外空格

1 个答案: