web-dev-qa-db-ja.com

配列を反復するJadeでhtmlテーブルを作成する方法

私は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>

だから、アイデアはありますか?

23
PaquitoSoft

問題は、各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}
33
PaquitoSoft

これを試して

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}
7
Chance

現在のパグバージョンでは、私にとってはうまくいきませんでした。代わりに、コードを次のパターンに変更しました。

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