Pug table values not being put in the correct column

问题: I have a simple table that I'd like to display, but the display seems a little off. I'd like the signCount variable of each court to be under the "Sign Count" column, but f...

问题:

I have a simple table that I'd like to display, but the display seems a little off. I'd like the signCount variable of each court to be under the "Sign Count" column, but for some reason it's appearing under the "Court Name" column under each court name. It seems something is messing up with the each loops... Thanks!

courts, court.users, and collections are arrays which look like this:

courts = 
[ { orgName: 'Court 1',
    sortNumber: 9,
    level: 2,
    createdAt: 2018-02-12T09:09:15.920Z,
    lastModify: null,
    _id: 5a8159bb65314c0407b17533,
    users: [ [Object], [Object] ],
    parentID: 5a74292665314c0407b0ea2b,
    __v: 0 },
  { orgName: 'Court 2',
    sortNumber: 1,
    level: 3,
    createdAt: 2018-03-06T06:02:12.820Z,
    lastModify: null,
    _id: 5a9e2ee42b8baf66accc7b4a,
    users: [ [Object], [Object] ],
    parentID: 5a8159bb65314c0407b17533,
    __v: 0 },
  { orgName: 'Court 3',
    sortNumber: 7,
    level: 3,
    createdAt: 2018-03-06T06:45:05.439Z,
    lastModify: 2018-04-01T11:51:19.969Z,
    _id: 5a9e38f12b8baf66accc7bd4,
    users: [ [Object] ],
    parentID: 5a8159bb65314c0407b17533,
    __v: 0 }];;

courts.users = [{ userName: '1100zs',
  displayName: 'Court 1',
  phone: '',
  memo: '',
  mobilePhone: '',
  isMaster: true }
{ userName: '1100dd',
  displayName: 'Court 1.1',
  phone: '',
  memo: '',
  mobilePhone: '',
  isMaster: false }];

collections = [{courtName: '51zs', signCount: 15}, {courtName: '54zs', signCount: 7}, {courtName: '45zs', signCount: 8}];


extends layout

block content
  h1 Courts
    table(id="courts" align='center')
      tr
        th Court Name
        th Level
        th Display Name
        th Users
        th Sign Count
      each court in courts 
        tr 
          td #{court.orgName}
          td #{court.level}
          if court.users
            if court.users.length >= 1
              td #{court.users[0].displayName}  
              td #{court.users[0].userName}
        each item in collections
          if court.users.length >= 1
            if item.courtName == court.users[0].userName
                td #{item.signCount}
            else
                td 0
    h2  #{signCount} / #{total}

The html looks like this: (Sorry for the poor formatting. Since I wrote it in pug, I had to manually indent everything.)

<html>
    <head>
    <meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"><meta http-equiv="x-ua-compatible" content="ie=edge">
    <link rel="stylesheet" href="/stylesheets/style.css">
    <title>Courts by region</title>
</head>
<body>
    <h1>Courts<table id="courts" align="center"> 
    <tbody>
        <tr>
            <th>Court Name</th>
            <th>Level</th>
            <th>Display Name</th>
            <th>Users</th>
            <th> Sign Count </th>
        </tr>
        <tr> 
            <td>Court 1</td>
            <td>2</td>
            <td>Court User[0]  </td>
            <td>1100zs</td>
        </tr>
        <tr>
            <th>9</th> <!-- This number should go under Sign Count... -->
        </tr>
        <tr> 
            <td>Court 2</td>
            <td>3</td>
            <td>Court User[0]  </td>
            <td>1101zs</td>
        </tr>
        <tr>
            <th>0</th>
        </tr>
        <tr> 
            <th>0</th> <!-- This number should go under Sign Count... -->
        </tr>
    </tbody>
    </table>
</h1>

<h2> 9 / 207</h2>
        <footer>
            <hr><p> © 2019 </p>
        </footer>
    </body>
</html>

回答1:

You just need to indent the each item in collections line (and its children) by two spaces to get it to fall under the <tr> instead of creating a new one.

  • 发表于 2019-03-05 18:17
  • 阅读 ( 277 )
  • 分类:sof

条评论

请先 登录 后评论
不写代码的码农
小编

篇文章

作家榜 »

  1. 小编 文章
返回顶部
部分文章转自于网络,若有侵权请联系我们删除