怎么样,我尝试与NodeJs,Mysql和Handlebars进行协商。 查询的结果我没有问题。 BD中的表格如下。
水果表
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 |
–––––––––––––––––––––––––––––––
答案 0 :(得分: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)次。