javascript - 防止模板循环内的标签多次输出?

标签 javascript underscore.js

我正在尝试创建一个带有 id 单元格的表格,该单元格应根据 sessions 数组长度跨越 3 列,因为 id cell 位于循环内部,当我只希望它显示一次时,它会输出 3 次。是否可以在模板中设置某些内容来执行此操作?

JS

<table>
    <tbody class="js-output">
        <script type="text/html" id="tmpl">
            <% _.each(sessions, function(session) { %>
                <tr>
                    <td rowspan="<%- session.length %>"><%- id %></td>
                    <td><%- session %></td>
                    <td><select name="" id=""></select></td>
                </tr>
            <% }) %>
        </script>
    </tbody>
</table>

fiddle :https://jsfiddle.net/egks4ys1/

硬编码布局:https://jsfiddle.net/egks4ys1/1/

最佳答案

这是一个模板,它将第一个 session 元素与其其余元素分开处理。

<table>
    <tbody class="js-output">
        <script type="text/html" id="tmpl">          
            <tr>
                <td rowspan="<%- sessions.length %>"><%- id %></td>
                <td><%- _.first(sessions) %></td>
                <td><select name="" id=""></select></td>
            </tr>
            <% _.each(_.rest(sessions), function(session) { %>
                <tr>
                    <td><%- session %></td>
                    <td><select name="" id=""></select></td>
                </tr>
            <% }) %>
        </script>
    </tbody>
</table>

fiddle :https://jsfiddle.net/egks4ys1/6/

关于javascript - 防止模板循环内的标签多次输出?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/33035911/

相关文章:

JavaScript 替代品 underscore.js

jquery - Backbone.js - 从现有 html 实例化模型/ View

Javascript:通过 lodash 或下划线或 corejavascript 转换对象响应数组

javascript - 分组数组变空(Lodash 的 groupBy 确实有效)

javascript - JQuery 点击功能不起作用

javascript - 单击按钮时如何添加CSS

javascript - 我们如何使用 dc.js 和传单 map 通过 map 悬停来过滤图表

javascript - React Router - 在嵌套组件内安装组件

javascript - 使用 selectedIndex 将值更改为空白选择

javascript - 我将如何优化查找视口(viewport)中可见的最上面行