Question

我正在尝试访问EJS模板中的嵌套数组。在我的后端，我正在渲染这个，'lists'是一个业务数组，userId是来自会话的用户_id。

res.render('listOfBusinesses', {lists:business, userId:loggedUserID});

在前端我循环遍历列表并获取正确的属性值，但是一个属性是一组追随者_ids，我需要与userId交叉检查以提供跟随按钮或取消关注按钮。

前端看起来像这样：

<% for (var i = 0; i < lists.length; i++) { %>

  <div class="col-xs-6 col-sm-4 panel">
     <a href="/busProfileFromUser?busId=<%= lists[i]._id %>">
      <img src="<%= lists[i].imgpath %>" class="img-responsive follow-img" />
     </a> 
  </div>

上面的工作正常，但属性lists[i].followers是一个我需要再次循环但却无法正确获取语法的数组。

我正在考虑这些问题：

for (var i = 0; i< lists[i].followers.length; i++){

  if (list[i] == userId) {
    <button>Follow</button>
  } else {
    <button>Unfollow</button>
  }
}

非常感谢任何建议!!

几乎已经解决了这个问题，但问题是部分问题是传递给渲染的变量是在条件语句中使用的，它正在检查对象id是否等于字符串。所以我调用toString（）来确保它们是字符串。它现在返回正确的按钮，但它只返回一个按钮，而不显示其余业务列表的任何内容。任何人都可以了解其他按钮没有显示的原因

        <% for (var j = 0; j < lists[i].followers.length; j++) {%>

            <% if (lists[i].followers[j].toString() == userId.toString())           { %>
              <button>Unfollow</button>

              <% } else { %>
                <button>FOLLOW</button>
              <% } %>

        <% } %>

Answer 1

EJS完全支持嵌套循环和条件。遍历某个列表后，可以使用另一个迭代变量并进行嵌套循环。

<% for (var i = 0; i < lists.length; i++) {%>
  <a href="/busProfileFromUser?busId=<%= lists[i]._id %>">
    <img src="<%= lists[i].imgpath %>" class="img-responsive follow-img" />
  </a>

  <!-- Nested loop below --> 
  <% for (var j = 0; j < lists[i].followers.length; j++) {%>
    <li>
      <% if (lists[i].followers[j] == userId) { %>
        <button>Follow</button>
      <% } else { %>
        <button>Unfollow</button>
      <% } %>
    </li>
  <% } %>

<% } %>

Answer 2

您需要将i更改为其他内容，因为它会覆盖外部范围循环中的i。

您也没有访问followers属性。

你的内循环应如下所示：

<% for (var j = 0; j < lists[i].followers.length; j++) { %>
  <% if (list[i].followers[j] == userId) { %>
    <button>Follow</button>
  <% } else { %>
    <button>Unfollow</button>
  <% } %>
<% } %>

Answer 3

    //Controller Side 
     var sidebarnavigation = req.session["sidebarnavigation"];
      res.render(view_path, {
        TODAY_DATE: TODAY_DATE,
        base_URL: base_URL,
        navigations: sidebarnavigation,
      });
    
    
    Nested Loops In EJS
    <body class="mini-sidebar">
        <div class="main-wrapper">
          **<!-- sidebar menu -->
          <%-include("../partials/common_sidebar_nav",{"navigations":navigations})%>**
        </div>
//Partial Section

        <div id="sidebar-menu" class="sidebar" style="cursor: pointer;">
          <div class="sidebar-inner slimscroll">
              <div id="sidebar-menu1" class="sidebar-menu">
                  <ul>            
                    <% navigations.forEach(function(menu){%>                
                            <li class="menu-title"><%= menu.role_name %><span></li>
                                <% menu.main_menu.forEach(function(main_menu){ %>
                                    <li class="submenu">
                                        <a href="#">                                    
                                            <span><%= main_menu.nav_display_name %> </span><span class="menu-arrow"></span>
                                        </a>                                
                                        <ul style="display: none;">
                                            <% main_menu.sub_menu.forEach(function(sub_menu){ %>
                                                <li>
                                                    <a>
                                                        <i class="la la-minus"></i>&nbsp; <%= sub_menu.nav_display_name %>
                                                    </a>
                                                </li>
                                            <%})%>                                    
                                        </ul>
                                    </li>
                                <%})%>
                    <%})%>
                    
                  </ul>
              </div>
          </div>
        </div>

嵌套的EJS模板循环

3 个答案: