【问题标题】:Render table with Jade/Express.js having multiple elements per row使用 Jade/Express.js 渲染表格,每行有多个元素
【发布时间】:2012-06-26 03:54:57
【问题描述】:

我正在尝试使用简单对象数组中的翡翠来渲染表格。但不是简单地为每个对象渲染一行,我想在每一行上渲染三个对象。

<table>
  <thead>...</thead>
  <tbody>
    <tr>
      <td>obj0</td>
      <td>obj1</td>
      <td>obj2</td>
    </tr>
    <tr>
      <td>obj3</td>
      <td>obj4</td>
      <td>obj5</td>
    </tr>
    ...
  </tbody>
</table

【问题讨论】:

    标签: html node.js express html-table pug


    【解决方案1】:
    objects = [[obj0, obj1, obj2], [obj3, obj4, obj5]]
    
    table
      thead
      tbody
      for object in objects
        tr
          for subobject in object
            td= subobject
    

    【讨论】:

    • 谢谢。我没有想过在建表循环之前重新组织对象。
    【解决方案2】:

    接受的答案在技术上是有效的,但我不喜欢你必须构建数据才能使逻辑有效。我认为逻辑应该容纳数据。因此,我想出了这个:

    objects = [obj0, obj1, obj2, obj3, obj4, obj5]
    
    table
      thead
      tbody
        - var columns = 3
        - for (var i = 0; i < objects.length; i=i+columns)
          tr
            - for (var j = 0; j < columns && i+j < objects.length; j++)
              td=objects[i+j]
    

    【讨论】:

    • 回顾这一点,如果您使用类似lodash's chunk 的内容,您可以在此答案和公认答案之间实现两全其美。您可以通过动态重新排序数据来使用更具可读性的方法(但是,这是假设您的列表很小;您会为chunking 非常大的列表支付性能损失)
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2013-04-23
    • 1970-01-01
    • 2022-12-05
    • 2018-01-02
    • 1970-01-01
    • 2014-08-10
    • 2018-06-09
    相关资源
    最近更新 更多