如何在Node.js和Express中以嵌套形式呈现多个.ejs文件？ [英] How to render multiple .ejs files in nested form in Node.js and Express?
问题描述
如何以嵌套形式呈现多个 .ejs 文件？
How can I render multiple .ejs files in nested form?
所以我有一个以下文件：
So I have a following file:
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})
});
});
}
});
其中 index.ejs 由非常基本的html标签（html，head，body和一个 p 标签），并且具有<％ - content％> index2.ejs 文件，这意味着它没有html，body，head标签。
Where index.ejs consists of very basic html tag (say html, head, body, and one p tag) and have <%- content %> in it, where content is assumed to be rendered by another .ejs file, which doesn't include html, head, or body tag and is only assumed to be rendered a content and a title. However, when I accessed to this file by POST request and tried to render files and then checked out the outputted HTML file from my browser, the content consisted only of index2.ejs file, which means it has no html, body, head tag.
那么我失踪了什么？如果我想通过< script src ='some_file.js'>< / script> 包含一个JavaScript库，我应该在尝试时添加另一个渲染属性在 index2.ejs 文件...中呈现
So what am I missing? And if I want to include a javascript library by <script src='some_file.js'></script>, should I add another rendering property when I try to render in index2.ejs file...right?
谢谢。
推荐答案
首先，我认为你对 res.render 的操作感到困惑。根据文档：
First, I think you are confused on how res.render operates. According to the docs:
res.render（view，[localals]，callback）
res.render(view, [locals], callback)
使用回调响应的渲染字符串渲染视图。 >
Render a view with a callback responding with the rendered string.
这就解释了为什么你只在HTML页面中看到index2.ejs的内容。
which explains why you are only seeing the content of index2.ejs in your HTML page.
现在，有多种方法可以实现您的目标，即在视图中嵌套视图。从Express 3.x开始，您需要使用 include 。在这种情况下，您可以重写如下所示的视图：
1-定义一个header.ejs文件，看起来像这样 example 。
2-定义footer.ejs。看起来像这个其他示例。
3-在您的index2.ejs中，包含这两个文件，如下所示：
Now, there are multiple ways to achieve your goal, which is nesting views within views. Starting from Express 3.x, you need to use include.In this case, you can rewrite your views like this:
1- Define a header.ejs file, which would look like this example.
2- Define a footer.ejs. which would look like this other example.
3- In your index2.ejs, include these two files, like this:
<% 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 ，它允许您只通过指定路径来插入任何视图：
A second method is to use ejs-locals, which allows you to insert any view by only specifying their path:
res.render('index', {
title: 'title',
content: 'index2',
data:rows
});
而且，在index1.ejs中，您将拥有：
And, in your index1.ejs, you will have:
<html><head>
<title><%= title %></title></head>
<body><p>
<%- partial('index2',{}) %>
</p></body></html>
此方法的优点是可以使用额外的对象将额外的值传递给您的视图。查看ejs-locals github页面了解更多详情。
The advantage of this method is you can pass extra values to your view, using the extra object. Check out the ejs-locals github page for more details.
这篇关于如何在Node.js和Express中以嵌套形式呈现多个.ejs文件？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
