如何在Node.js和Express中以嵌套形式呈现多个.ejs文件？

董品

2023-03-14

问题内容：

如何.ejs以嵌套形式呈现多个文件？

所以我有以下文件：

var mysql = require('mysql');
var ejs = require('ejs');
exports.index = function(req, res){
    if (req.method=='POST'){
        var connection = mysql.createConnection({user:'root', password:'root', database:'testdb'});
        var name = req.param('name');
        connection.query('select * from table_name where name = ?', name, function(err, rows, fields){
            if(err) throw err;
            res.render('index', {
                 title: 'title', content: res.render('index2', {data:rows})
            });
        });
    }
});

where index.ejs由非常基本的html标记（例如html，head，body和一个p标记）组成并包含<%- content %>在其中，其中内容假定由另一个.ejs文件呈现，其中不包含html，head或body标记，仅假定呈现了内容和标题。但是，当我通过POST请求访问此文件并尝试呈现文件，然后从浏览器中签出输出的HTML文件时，内容仅包含index2.ejs文件，这意味着它没有html，body和head标记。

那我想念什么呢？而且，如果我想通过添加一个Javascript库<script src='some_file.js'></script>，当我尝试在index2.ejs文件中进行渲染时，是否应该添加另一个渲染属性…对吗？

问题答案：

首先，我认为您对res.render操作方式感到困惑。根据文档：

res.render（视图，[本地]，回调）

使用回调响应渲染的字符串来渲染视图。

这就解释了为什么只在HTML页面中看到index2.ejs的内容。

现在，有多种方法可以实现您的目标，即在视图中嵌套视图。从Express 3.x开始，您需要使用include。在这种情况下，您可以这样重写视图：
1-定义header.ejs文件，该文件类似于以下示例。
2-定义一个footer.ejs。这看起来像另一个例子。
3-在您的index2.ejs中，包括这两个文件，如下所示：

<% include header %>
    //The HTML of your index2.ejs
    //You can add some reusable views, like, say, a submit button above the footer
    <% include reusable_views/submit %>
<% include footer %>

第二种方法是使用ejs-locals，它允许您仅指定视图的路径来插入任何视图：

res.render('index', {
                 title: 'title', 
                 content: 'index2', 
                 data:rows
            });

而且，在index1.ejs中，您将拥有：

<html><head>
<title><%= title %></title></head>
<body><p>
<%- partial('index2',{}) %>
</p></body></html>

这种方法的优点是您可以使用额外的对象将额外的值传递给视图。请查看ejs-locals github页面以获取更多详细信息。

如何在Node.js和Express中以嵌套形式呈现多个.ejs文件？

相关阅读

相关文章

相关问答

相关工具

相关文档