Question

我在外部模板中使用下划线（使用require.js）并尝试访问document.ready函数中的数据。但是在执行模板时我得到了上面提到的错误以下是代码段

<script>
    $(document).ready(function(){
         <%_.each(people, function(person){ %>
             console.log(<%=person%>);
      <% }); %>
    });
</script>

我哪里错了？所有帮助将不胜感激。感谢

Answer 1

您似乎对模板的工作方式感到有些困惑。你需要两件事：

模板。这通常位于<script type="text/x-underscore">容器内。我们将<script>与非HTML和非JavaScript type一起使用，以防止浏览器以任何方式尝试解释模板数据，我们希望浏览器单独保留模板以便我们可以拥有我们采用_.template。
使用该模板的JavaScript。您可以在此处调用_.template来创建模板的函数表示，然后调用该函数来获取HTML。

所以，如果你想制作一个人员列表，你就会有一个这样的模板：

<script id="t" type="text/x-underscore">
    <% _(people).each(function(person) { %>
        <%= person %>
    <% }); %>
</script>

然后你会有一些像这样的JavaScript来使用它：

<script type="text/javascript">
    $(document).ready(function() {
        var people = [ 'Tom', 'Dick', 'Harry' ];
        var tmpl   = _.template($('#t').html());
        $('body').append(tmpl({
            people: people
        }));
    });
</script>

请注意<% ... %>中没有<script type="text/javascript">内容，这些内容会出现在模板中。

你可以在模板中调用你想要的任何JavaScript，这样你也可以这样做：

<script id="t" type="text/x-underscore">
    <% _(people).each(function(person) { %>
        <% console.log(person) %>
    <% }); %>
</script>

当然，如果这就是你想做的事情，那么根本就不会使用模板，你只需编写一些JavaScript：

<script type="text/javascript">
    $(document).ready(function() {
        var people = [ 'Tom', 'Dick', 'Harry' ];
        _(people).each(function(person) { // Or any of the other ways of looping over people...
            console.log(person);
        });
    });
</script>

以上是上述快速演示：http://jsfiddle.net/ambiguous/V7DXv/

意外的令牌＆lt;在脚本标记内使用外部下划线模板时出错

1 个答案: