如何.ejs以嵌套形式呈现多个文件?
.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标记。
index.ejs
p
<%- content %>
index2.ejs
那我想念什么呢?而且,如果我想通过添加一个Javascript库<script src='some_file.js'></script>,当我尝试在index2.ejs文件中进行渲染时,是否应该添加另一个渲染属性…对吗?
<script src='some_file.js'></script>
首先,我认为您对res.render操作方式感到困惑。根据文档:
res.render
res.render(视图,[本地],回调) 使用回调响应渲染的字符串来渲染视图。
res.render(视图,[本地],回调)
使用回调响应渲染的字符串来渲染视图。
这就解释了为什么只在HTML页面中看到index2.ejs的内容。
现在,有多种方法可以实现您的目标,即在视图中嵌套视图。从Express 3.x开始,您需要使用include。在这种情况下,您可以这样重写视图: 1-定义header.ejs文件,该文件类似于以下示例。 2-定义一个footer.ejs。这看起来像另一个例子。 3-在您的index2.ejs中,包括这两个文件,如下所示:
include
<% 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页面以获取更多详细信息。