如何在内容模板循环中重用页眉、页脚模板

Question

我对@9​​87654322@ 模板不是很熟悉。我正在尝试打印一个包含 3 个内容元素的页面，每个元素显示 3 个数据。

每个content 都需要有一个标题并与它们一起继续元素。最后一个应该有页脚模板而不是继续。

我完全不知道如何实现这一点......请任何人帮助我吗？

这是我的尝试：

<script type="text/template" id="header">
    <div id="header">
        <h6>this is Header</h6>
        <span><% students.name[0] %></span>
   </div>
</script>
<script type="text/template" id="content">
    <div id="content">
    <h6>Content</h6>
    <% _.each(students, function (item, index) { %>
        <% if(index % 3 == 0 ) { %>
           <% return $('#header').html() %>
        <% } %>
        <li><%= item.name %></li>
    <% }) %>
            </div>
</script>

<script type="text/template" id="continue">
     <span>Continue....</span>
</script>

<script type="text/template" id="footer">
    <div id="footer>
    <span>End of Document</span>
</div>
</script>

运气不好。有人请帮帮我吗？

Live Demo

Answer 1

在我看来，您的主要问题是如何递归评估模板。这很好用，您只需要小心使用<%= %> 而不是<% %> 并传递他们在父模板调用时应该有权访问的任何参数。

// http://jsfiddle.net/uwmbznxb/1/
<script type="text/template" id="header">
<div id="header">
    <h6>this is Header</h6>
    <span><%= name[0] %></span>
</div>
</script>
<script type="text/template" id="content">
   <div id="content">
   <h6>Content</h6>
   <% _.each(students, function (item, index) { %>
        <% if(index % 3 == 0 ) { %>
            <% if (index) { %>
                   <%= _.template($('#continue').html())(item) %>
            <% } %>
           <%= _.template($('#header').html())(item) %>
        <% } %>
        <li><%= item.name %></li>
    <% }) %>
        <%= _.template($('#footer').html())({}) %>
            </div>
 </script>
 // other templates ..