如何打印MongoDB嵌套数组数据？EJS渲染遇forEach未定义错误

问题根源 #

• 变量名不匹配：EJS中使用的bookSubs变量未定义，直接导致forEach报错；同时foundEbook是完整的MongoDB文档对象，直接遍历它逻辑错误，应该遍历文档内的ebookSubs数组。
• 嵌套遍历逻辑冗余：原代码的双层遍历无意义，ebookSubs本身就是主题数组，直接遍历该数组即可。

修正步骤 #

1. 确认后端传参：确保后端将查询到的含ebookSubs数组的MongoDB文档，以foundEbook为名传给EJS模板。
2. 正确遍历主题数组：直接遍历foundEbook.ebookSubs，每个数组元素对应一个主题对象。
3. 按需嵌套遍历电子书：如果需要在主题卡片内展示该主题下的电子书，在主题遍历内部再遍历subject.ebooks子数组。

修正后的EJS代码 #

仅渲染主题卡片（不含电子书列表）

// 渲染主题卡片
<section id="sem_cards">
  <div>
    <div class="row row-cols-1 row-cols-md-3 g-4">
      <% if (foundEbook && foundEbook.ebookSubs) { %>
        <% foundEbook.ebookSubs.forEach(function(subject){ %>
          <a href="">
            <div class="col">
              <div class="card h-100">
                <img
                  src="Images/<%= subject.ebook_TopicImg %>"
                  class="card-img-top" />
                <div class="card-body">
                  <h1 class="card-title"><%= subject.ebook_Topic %></h1>
                  <p class="card-text mb-3">
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                    Repudiandae, cum officia. Molestias
                  </p>
                </div>
                <div class="card-footer">
                  <small>Latest updated for 2023</small>
                </div>
              </div>
            </div>
          </a>
        <% }) %>
      <% } %>
    </div>
  </div>
</section>

主题卡片内包含对应电子书列表

如果需要在主题卡片里展示该主题下的所有电子书，可添加子数组遍历：

// 渲染带电子书列表的主题卡片
<section id="sem_cards">
  <div>
    <div class="row row-cols-1 row-cols-md-3 g-4">
      <% if (foundEbook && foundEbook.ebookSubs) { %>
        <% foundEbook.ebookSubs.forEach(function(subject){ %>
          <div class="col">
            <div class="card h-100">
              <img
                src="Images/<%= subject.ebook_TopicImg %>"
                class="card-img-top" />
              <div class="card-body">
                <h1 class="card-title"><%= subject.ebook_Topic %></h1>
                <p class="card-text mb-3">
                  Lorem ipsum dolor sit amet, consectetur adipisicing elit.
                  Repudiandae, cum officia. Molestias
                </p>
                <!-- 遍历当前主题下的电子书 -->
                <div class="ebook-list">
                  <h5>相关电子书：</h5>
                  <ul>
                    <% subject.ebooks.forEach(function(ebook){ %>
                      <li><a href="<%= ebook.ebook_Link %>"><%= ebook.ebook_Name %></a></li>
                    <% }) %>
                  </ul>
                </div>
              </div>
              <div class="card-footer">
                <small>Latest updated for 2023</small>
              </div>
            </div>
          </div>
        <% }) %>
      <% } %>
    </div>
  </div>
</section>

额外提示 #

• 添加if (foundEbook && foundEbook.ebookSubs)判断，避免因数据未加载或为空导致的报错。
• 确保后端查询MongoDB时，正确返回包含ebookSubs数组的完整文档，比如使用Model.findOne()或Model.find()方法获取数据。

内容的提问来源于stack exchange，提问作者Vinit P. Jain