Question

使用下划线模板，我正在尝试创建日历。我想将每一天放在自己的<td></td>中，并在7天之后插入一个表格行<tr></tr>。因此，7天将像一周一样出现在一行中。

我想要实现的目标

<table> 
    <thead> 
    <tr> 
        <th>Monday</th> 
        <th>Tuesday</th> 
        <th>Wednesday</th> 
        <th>Thursday</th> 
        <th>Friday</th> 
        <th>Saturday</th> 
        <th>Sunday</th> 
    </tr> 
    </thead>  
    <tr>
        <td>1th</td><td>2nd</td><td>3rd</td><td>4th</td><td>5th</td><td>6th</td><td>7th</td>
    </tr>
    <tr>
        <td>8th</td><td>9th</td><td>10th</td><td>11th</td><td>12th</td><td>13th</td><td>14th</td>
    </tr>
    // through to 35 days 
</table>

在下划线模板中，我使用.each循环显示来自api的日期列表。我已经做了这个悲伤的尝试，如果它是7的倍数使用索引，然后添加<tr>，但正如预期的那样，表被破坏了。他是我的尝试

    <table> 
        <thead> 
        <tr> 
            <th>Monday</th> 
            <th>Tuesday</th> 
            <th>Wednesday</th> 
            <th>Thursday</th> 
            <th>Friday</th> 
            <th>Saturday</th> 
            <th>Sunday</th> 
        </tr> 
        </thead>  
        <% _.each(allDaysData, function(item, index){ %> 
        <% if ( index == 6 || index == 13 || index == 20 || index == 27) { %> <tr>  <% } %> 
            <td >     <%= allDaysData.day %>     </td> 
            <% if ( index == 6 || index == 13 || index == 20 || index == 27) { %> </tr>
        <% } %>         <% }) %> 
    </table>

有谁能告诉我如何正确地做到这一点？希望我已经提供了足够的信息，说明我想要做什么。如果没有，我可以添加更多细节。

Answer 1

我不知道underscore.js但这对我来说很好。

＆＃13;

<tr>
<% _.each(allDaysData, function(item, index){ %> 
<td> <%= item.day %> </td> 
<% if ((index + 1) % 7 == 0) { %> </tr><tr>  <% } %> 
<% }) %> 
</tr>

＆＃13;

Answer 2

考虑使用%（modulo）运算符。您实现的是仅在处理每个第7个元素时运行if回调。

所以在你的例子中，而不是index == 6, index == 13, ...

的显式声明

你可以使用

if((index + 1) % 7 === 0) { print <tr> here }

使用.each（下划线）将表行添加到表中

2 个答案: