Nodejs EJS中的循环

tktrz96b 于 2023-08-04 发布在 Node.js

关注(0)|答案(1)|浏览(117)

我有一个带bootstrap的nodejs应用程序。引导卡应按3个一行和与列中的数据一样多的数量放置。我尝试了两个for循环，但数据在每行中重复。我想不出如何实现这一点。
我的EJS代码

<% for(var i=0; i<details.length; i++) { %>
          <div class="row">
            <% for(var j=0; j<3; j++) { %>
              <div class="col-sm">
                <div class="card border-danger mb-3" style="max-width: 20rem;">
                    <div class="card-body">
                      <h4 class="card-title"><%= details[i].name %></h4>
                        <p class="card-text">Location : <%= details[i].location %><br>
                          City: <%= details[i].city %><br>
                          Available: <%= details[i].available %><br>
                          Phone No: <%= details[i].phone %></p>
                    </div>
                </div>
              </div>
            <% } %>
          </div>
        <% } %>

字符串
只是为了表示，我希望卡片以这种方式显示我的数据：

的数据

node.js

来源：https://stackoverflow.com/questions/60982994/loop-in-nodejs-ejs

1条答案

按热度按时间

vtwuwzda1#

看起来你只需要一个循环就可以了。要使行逻辑正确，只需检查循环计数器i，看看您是否在索引0、3、6等上，然后如果是，则可以发出一行。

<% for(var i = 0; i < details.length; i++) { %>
  <% if (i === 0 || i % 3 === 0) { %>
    <div class="row">
  <% } %>
    <div class="col-sm">
      <div class="card border-danger mb-3" style="max-width: 20rem;">
          <div class="card-body">
             <h4 class="card-title"><%= details[i].name %></h4>
                <p class="card-text">Location : <%= details[i].location %><br>
                  City: <%= details[i].city %><br>
                  Available: <%= details[i].available %><br>
                  Phone No: <%= details[i].phone %>
                </p>
          </div>
      </div>
    </div>
  <% if (i % 3 === 2 || i === details.length - 1) { %>
    </div>
  <% } %>
<% } %>

字符串

赞(0）回复(0）举报 2023-08-04

我来回答

Nodejs EJS中的循环

1条答案

相关问题

热门标签

最新问答