Javascript 在主干/下划线模板中使用循环
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/11780974/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Using loops in backbone/underscore's templates
提问by Nyxynyx
I have a backbone.js/underscore.js template that I am feeding into a backbone view for rendering. The View is passed a model that contains an array postsof objects (which I call postin the template).
我有一个backbone.js/underscore.js 模板，我将它输入到主干视图中进行渲染。View 传递了一个模型，该模型包含一个posts对象数组（我post在模板中调用）。
Problem: When I try to loop through all the elements of the array posts, I get an error Uncaught SyntaxError: Unexpected token )and refers a line in the backbone View's code template: _.template( $('#tpl_SetView').html() ).
问题：当我尝试遍历数组的所有元素时posts，出现错误Uncaught SyntaxError: Unexpected token )并引用主干视图代码中的一行template: _.template( $('#tpl_SetView').html() )。
Am I doing the loop incorrectly which is causing this error?
我是否在错误地执行循环从而导致此错误？
Template code
模板代码
<script type="text/template" id="tpl_SetView">
<div class="row_4">
<div class="photo_container">
<div class="set_cover">
<img src="/<%= posts[0].thumb_subpath %><%= posts[0].img_filename %>" width=240 />
</div>
<div class="set_thumbs">
<%= _.each(posts, function(post) { %>
<img src="<%= post.thumb_subpath %><%= posts.img_filename %>" width=55 />
<%= }); %>
</div>
</div>
</div>
</script>
回答by James Woodruff
To echo a variable use <%= %>, but to parse javaScript code, just use <% %>.
要回显变量 use <%= %>，但要解析 javaScript 代码，只需使用<% %>.
For example:
例如：
// In your Backbone View
var posts = {"posts": this.model.toJSON()};
var template = _.template($("#tpl_SetView").html(), posts);
// In your template
<div class="row_4">
<div class="photo_container">
<div class="set_cover">
<img src="/<%= _.escape(posts[0].thumb_subpath) %><%= _.escape(posts[0].img_filename) %>" width=240 />
</div>
<div class="set_thumbs">
<% _.each(posts, function(post){ %>
<img src="<%= _.escape(post.thumb_subpath) %><%= _.escape(posts.img_filename) %>" width=55 />
<% }); %>
</div>
</div>
</div>
回答by JayC
I think you will find that the problem is in these lines:
我想你会发现问题出在这几行：
<%= _.each(posts, function(post) { %>
<img src="<%= post.thumb_subpath %><%= posts.img_filename %>" width=55 />
<%= }); %>
From my recollection of what underscore does to evaluate templates, these lines don't make much sense. Each <%=..%> item is evaluated separately.. that is, they must be full evaluatable expressions, not partial function blocks..
根据我对下划线评估模板的作用的回忆，这些行没有多大意义。 每个 <%=..%> 项都被单独评估..也就是说，它们必须是完整的可评估表达式，而不是部分功能块..
Edit: Actually, James is right. <%..%> can be defined separately (it all comes down to a big javascript string in the end). It is escaped and the interpolated expressions that must be separate expressions.
编辑：实际上，詹姆斯是对的。<%..%> 可以单独定义（最终归结为一个大的javascript字符串）。它被转义，并且插入的表达式必须是单独的表达式。
Edit II: Even so, in the evaluation context I think the use of the function block would still possibly create a bizzare javascript string that might not evaluate quite as intended... I'd have to think about it. It might still work out totally fine.
编辑二：即便如此，在评估上下文中，我认为功能块的使用仍然可能会创建一个奇怪的 javascript 字符串，该字符串可能无法按预期评估......我必须考虑一下。它可能仍然完全正常。
