如何在视图节点内显示视图.js

Question

我的仪表板有一个视图、路由和控制器。我还有一个用于小部件的路由、视图和控制器。在仪表板上，我想显示这些小部件。如果我去 localhost：3000/widget，我实际上可以看到从数据库中提取的数据，并且一切都在工作。但是，在我的仪表板视图上，如果我尝试包含它，例如：

<%- include('../widget/widget.ejs') %>

然后没有任何数据显示，我在控制台中没有看到任何错误。正确的方法是什么？

这是小部件路由：

router.get('/widget', isAuth, widgetController.getIndex);

小部件控制器：

const Product = require("../models/product");
exports.getIndex = (req, res, next) => {
 Product.find({ "requests.userId": req.user }, {title: 1})
    .then(product => {
      res.render("widget/widget", {
        path: "/widget",
        product: product
      });
    })
    .catch(err => {
      console.log(err);
    });
};

小组件视图：

            <% for (const products of product) { %>
            <li><i class="list-box-icon sl sl-icon-doc"></i>
                <strong><%= products.title %></strong>
            </li>
            <% } %>

仪表板路由：

router.get('/dashboard', accountController.getDashboard);

仪表板控制器是相当多的代码，所以我只是将其简化为最简单的形式。

exports.getDashboard = (req, res, next) => {
  if (req.user._id == '5d57abbd24e21t41u56c1t66') {
    Product.find({ status: "pending" })
    .sort({ createdAt: -1 })
    .then(products => {
      res.render("account/dashboard", {
        pageTitle: "Dashboard",
        path: "/dashboard",
        products: products
      });
    })
    .catch(err => {
      const error = new Error(err);
      error.httpStatusCode = 500;
      return next(error);
    });

Answer 1

是的，所以你看到的问题是，在小部件路由中，你从数据库中提取数据，然后将其渲染到组件 ejs。 在仪表板视图中，include 指令仅呈现来自 ejs 模板的 HTML，没有要填写的数据。

您的选择有多种。 最简单的（尽管可能不是最有效的）可能是只在仪表板中执行相同的数据库查询，然后将相关数据包含在要发送到视图的本地对象中。

另一种常见的方法，如注释中所述，是通过 ajax 发出客户端请求，该请求调用小部件端点并将结果注入仪表板中的适当位置。

第一种方法可以更轻松地一次性呈现仪表板，而第二种方法是逐步加载小部件和分离数据查询的更好方法。