node.js - 如何使用 Jade 迭代数组创建 html 表

Question

我从 node expressjs 框架开始，遇到了这个我无法解决的问题。

我正在尝试显示一个带有一些博客文章的表格（是的，一个博客......），但我没有完成它。

这是 Jade 模板代码：

div
  table
    thead
      tr: th Posts
    tbody
      each post, i in userPosts
        tr(class=(i % 2 == 0) ? 'odd' : 'even'): a(href='/admin/post/' + post.id) #{post.author} - #{post.title}

这是 HTML 输出：

<div>
  <a href="/admin/post/1">Post 1</a>
  <a href="/admin/post/2">Post 2</a>
  <a href="/admin/post/3">Post 3</a>
  <table>
    <thead>
      <tr>
        <th>Posts</th>
      </tr>
    </thead>
    <tbody>
      <tr class="odd"></tr>
      <tr class="even"></tr>
      <tr class="odd"></tr>
    </tbody>
  </table>
</div>

那么，有什么想法吗？

Answer 1

我发现问题在于我缺少每个 TR 的 TD 标签。所以玉代码应该是这样的：

div
  table
    thead
      tr: th Posts
    tbody
      each post, i in userPosts
        tr
          td 
            a(href='/admin/post/' + post.id) #{post.author} - #{post.title}

Answer 2

尝试这个

div
  table
    thead
      tr: th Posts
    tbody
      each post, i in userPosts
        tr(class=(i % 2 == 0) ? 'odd' : 'even') 
          td
            a(href='/admin/post/' + post.id) #{post.author} - #{post.title}

Answer 3

使用当前的哈巴狗版本对我不起作用。相反，我将代码修改为以下模式：

div
  table
    thead
      tr
        th title...
    tbody
      each post in userPosts
        tr
          td= post.author
          td= post.title