Question

我将下划线设置为胡须模式，如下所示：

_.templateSettings = {
  interpolate : /\{\{(.+?)\}\}/g
};

我已经获得了以下模板的一部分：

<script id="detail_view" type="text/template">
    <% for(registration in REGISTRATION_NUMBERS){ %>
        <tr>
            <td>{{registration.TYPE}}</td>
            <td>{{registration.VALUE}}</td>
        </tr>
<% } %>
</script>

导致“注册未定义”。使用this会导致整个部分在模板中输出。我做错了什么？

Answer 1

你有两个问题，一个你知道，另一个你不知道。

第一个问题是，当您只想替换其中一个时，您将替换所有三个_.templateSettings。你想要这个：

_.templateSettings.interpolate = /\{\{(.+?)\}\}/g;

这将仅留下_.templateSettings的evaluate和escape部分。你正在做的是：

_.templateSettings = {
  interpolate : /\{\{(.+?)\}\}/g,
  evaluate    : undefined,
  escape      : undefined
};

所以你最终没有evaluate。顺便说一句，你可以查看编译模板函数的source属性，看看你的模板编译成的JavaScript，JavaScript看起来不是那么容易，但看着它可以帮助解决这类问题

您不知道的问题是for...in循环用于迭代对象的属性，而不是数组中的值。这意味着registration将是您的循环中的字符串'0'，'1'，...而这不是您想要的。如果REGISTRATION_NUMBERS是一个数组，那么你的模板中需要这样的东西：

<% for(var i = 0; i < REGISTRATION_NUMBERS.length; ++i) { %>
    <% var registration = REGISTRATION_NUMBERS[i]; %>
    <tr>
        <td>{{registration.TYPE}}</td>
        <td>{{registration.VALUE}}</td>
    </tr>
<% } %>

或者，既然你有Underscore，你可以使用_.each：

<% _(REGISTRATION_NUMBERS).each(function(r) { %>
    <tr>
        <td>{{r.TYPE}}</td>
        <td>{{r.VALUE}}</td>
    </tr>
<% }) %>

演示：http://jsfiddle.net/ambiguous/jfckA/

胡子模式下划线模板中的循环

1 个答案: