underscore.js模板中的each循环

Question

我在这里做错了什么，但我看不出来！ 我正在尝试在Underscore模板中循环一个数组。 但是它不起作用，所以我错过了什么。 这是我的代码，我的模板除此之外都工作正常，只有_.each部分出了问题：

<script type="text/template" id="PageContent">
    <div class="col2">
        <@ _.each([0,1,2,3,4], function(i) { @>  <p><@ i @></p> <@ }); @>
    </div>    
</script>

我也做了一些模板设置，例如这样：

_.templateSettings = {
    interpolate: /\<\@(.+?)\@\>/gim
};

- Joel

---

首字母大写的Images是一个类还是一个数组？ - sunkencity

很奇怪，我是唯一一个遇到这个问题的人... - Joel

Answer 1

您的自定义模板配置中只定义了插值正则表达式，因此underscore不知道何时评估表达式。当您定义自定义模板设置时，需要定义和区分插值和评估。根据underscore的template()文档：

定义一个插值正则表达式和一个（可选的）评估正则表达式，以匹配应该被插入和评估的表达式。 如果没有提供评估正则表达式，则您的模板只能插入值。

在标准（无自定义设置）模板中，区别在于评估：<% %>和值插值：<%= %>。

因此，例如，您上面的模板应为（使用标准模板设置）：

<% _.each([0,1,2,3,4], function(i) { %>  <p><%= i %></p> <% }); %>

如果您想继续使用自定义设置，您需要在_.templateSettings中定义一个评估正则表达式。根据您的问题和评论，可以使用以下内容：

   _.templateSettings = {
      interpolate: /\<\@\=(.+?)\@\>/gim,
      evaluate: /\<\@(.+?)\@\>/gim
  };

然后更新您的模板，使用在代码块周围评估表单和在值周围使用插值表单，如下所示：

<script type="text/template" id="pageContent">
    <div class="col2">
        <@ _.each([0,1,2,3,4], function(i) { @>  <p><@= i @></p> <@ }); @>
    </div>    
</script>

来源: http://documentcloud.github.com/underscore/#template

- mjtognetti

---

你好！感谢您提供的出色答案。我现在已经更新为：_.templateSettings = { interpolate: /\<\@\=(.+?)\@\>/gim, evaluate: /\<\@(.+?)\@\>/gim, };但很遗憾，它并没有改变任何东西，我仍然得到相同的错误提示。 - Joel

嗯，你能发布你更新后的模板代码以及你遇到的错误吗？ - mjtognetti

更新了答案，而不是在这些评论中发布模板和设置。 - mjtognetti

我意识到这是一个旧帖子，但我通过将每个表达式的末尾的"/gim"更改为使用"/g"来使其工作。认为这可能会帮助一些偶然发现此线程的人！完整的正则表达式：_.templateSettings = { interpolate: /<@=(.+?)@>/g, evaluate: /<@(.+?)@>/g }; - royse41

定义既包括插值又包括评估的正则表达式解决了我的问题。 - Anand