使用 NodeJs 和 Handlebars 水平排序 table 的 <th> 标签

Question

怎么样，我试着咨询一下NodeJs，Mysql和Handlebars。查询结果我没有问题。 BD中的table如下

水果Table

Id    fruit
1     Apple
2     Mango
3     Strawberry

您进行查询的文件

Fruit.js

router.get('/', isLoggedIn, async (req, res) => {

  const fruitAll = await db.query('SELECT  * FROM fruit ’);

res.render(‘fruit’, {fruitAll});
});

我执行查看的文件如下

List.hbs

{{#each fruitAll}}
<div class="container p-4">
  <table border="1">
    <tr>
      <th>{{fruit}}</th>
    </tr>
    <tr>
      <th>Example 1</th>
      <th>Example 2</th>
      <th>Example 3</th>
    </tr>
  </table>
</div>
{{/each}}

结果如下：

--------------
Apple
--------------
Example 1
--------------
Mango
--------------
Example 2
--------------
Strawberry
--------------
Example 3
--------------

我想问的是怎么把水果横着放。我的意思是这样。

______________________________
|Apple   |Mango   | Strawberry|
_______________________________
|Example1|Example2| Example3  |
–––––––––––––––––––––––––––––––

Answer 1

它将是：

<div class="container p-4">
  <table border="1">
    <tr>
     {{#each fruitAll}}
      <th>{{fruit}}</th>
      {{/each}}
    </tr>
    <tr>
      <th>Example 1</th>
      <th>Example 2</th>
      <th>Example 3</th>
    </tr>
  </table>
</div>

因为您需要更多 th 个标签。在您的情况下，<div>..</div> 被复制了 fruitAll.length（在本例中为 3）次。

使用 NodeJs 和 Handlebars 水平排序 table 的 <th> 标签

Horizontally order the <th> tag of a table with NodeJs and Handlebars

mysql

node.js

handlebars.js