Express+Mongoose：从对象数组填充数据并在Handlebars展示表格

首先得指出你代码里的一个关键问题：你的sBranch是Bank模型里的内嵌数组，不是指向其他集合的引用字段，所以populate("sBranch")完全没用——Mongoose的populate只针对存储ObjectId的关联字段，用来拉取其他集合的关联文档。直接查询Bank集合就能拿到完整的分支数据，不需要额外的populate操作。

修正后的路由代码 #

把你的路由改成这样，直接查询所有银行数据并传给Handlebars模板：

router.get("/branch_data", isAdminOnly, ensureAuthenticated, (req, res) => {
  Bank.find({})
    .then(banks => {
      // 将查询到的银行数组传给模板，变量名是banks
      res.render("branch-template", { banks });
    })
    .catch(err => {
      console.error("查询银行数据失败:", err);
      res.status(500).send("服务器内部错误");
    });
});

Handlebars模板渲染嵌套表格 #

接下来在你的Handlebars模板里，通过两层{{each}}循环来渲染嵌套的表格：外层循环遍历银行，内层循环遍历每个银行下的分支。

<!-- 主表格：展示银行信息 -->
<table class="bank-table" border="1">
  <thead>
    <tr>
      <th>银行名称</th>
      <th>银行详情</th>
      <th>分支机构</th>
    </tr>
  </thead>
  <tbody>
    {{#each banks}}
      <tr>
        <td>{{sBankName}}</td>
        <td>{{sBankDetail}}</td>
        <td>
          <!-- 嵌套表格：展示当前银行的所有分支 -->
          <table class="branch-table" border="1">
            <thead>
              <tr>
                <th>分支名称</th>
                <th>分支详情</th>
              </tr>
            </thead>
            <tbody>
              {{#each sBranch}}
                <tr>
                  <td>{{sBranchName}}</td>
                  <td>{{sBranchDetail}}</td>
                </tr>
              {{else}}
                <!-- 当该银行没有分支时显示的内容 -->
                <tr>
                  <td colspan="2">暂无分支机构</td>
                </tr>
              {{/each}}
            </tbody>
          </table>
        </td>
      </tr>
    {{else}}
      <!-- 当没有任何银行数据时显示的内容 -->
      <tr>
        <td colspan="3">暂无银行数据</td>
      </tr>
    {{/each}}
  </tbody>
</table>

几个注意点 #

• 记得把路由里的branch-template替换成你实际的模板文件名（比如branch-data.hbs，不需要加后缀的话就写branch-data）。
• 可以给嵌套表格加一些CSS样式，比如缩小字体、增加内边距，让层级更清晰。
• 用{{else}}处理空数据的情况，避免页面出现空白，提升用户体验。

内容的提问来源于stack exchange，提问作者Nikhil Savaliya