我有一個 MongoDB 資料庫，我想匯入forEach3 個陣列。這是一個配方，我想看起來像第一列，quantity新列的unit旁邊和 的旁邊ingredients，每個列都是從資料庫陣列串列中匯入的。
這是我的代碼：
<div class="row pt-4">
<div class="col-12">
<h4>Ingredients</h4>
<ul class="list-group">
<% recipe.quantity.forEach(function(quantity, index){ %>
<li class="list-group-item"><%= quantity %></li>
<% }) %>
<% recipe.unit.forEach(function(unit, index){ %>
<li class="list-group-item"><%= unit %></li>
<% }) %>
<% recipe.ingredients.forEach(function(ingredients, index){ %>
<li class="list-group-item"><%= ingredients %></li>
<% }) %>
</ul>
</div>
</div>
uj5u.com熱心網友回復：
嘗試例如：
- 將行包裹在容器中。這很重要，因為 row 有負邊距。
- 將輸出分為 3 個串列 - 每列一個串列。
- 在串列之前顯示標題。
- 在移動設備上相互顯示所有串列：使用
col-md類或另一個。
<div class="container">
<div class="row pt-4">
<div class="col-md">
<h4>Quantity</h4>
<ul class="list-group">
<% recipe.quantity.forEach(function(quantity, index){ %>
<li class="list-group-item"><%= quantity %></li>
<% }) %>
</ul>
</div>
<div class="col-md">
<h4>Unit</h4>
<ul class="list-group">
<% recipe.unit.forEach(function(unit, index){ %>
<li class="list-group-item"><%= unit %></li>
<% }) %>
</ul>
</div>
<div class="col-md">
<h4>Ingredients</h4>
<ul class="list-group">
<% recipe.ingredients.forEach(function(ingredients, index){ %>
<li class="list-group-item"><%= ingredients %></li>
<% }) %>
</ul>
</div>
</div>
</div>
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/345381.html
標籤：html 节点.js 列表 bootstrap-4 ejs