在使用 Express.js 进行 web 开发时，经常需要进行前端模板的渲染。Express.js 默认提供了多种模板引擎，如 Pug、EJS、Handlebars 等。但在使用模板引擎时，有时会遇到一些模板渲染的问题，如变量未定义、渲染不完全等。本文将介绍如何解决 Express.js 中的模板渲染问题。
问题一：变量未定义
在使用模板引擎时，经常会出现变量未定义的错误。这是因为 Express.js 默认情况下没有设置模板渲染时的全局变量。为了解决这个问题，需在 app.js 文件中添加以下代码：
app.locals = {
title: 'My Website'
};以上代码会将一个名为 title 的全局变量添加到 Express.js 应用中。
接着在视图文件中使用 {{title}} 变量即可，如下所示：
// javascriptcn.com 代码示例
<!DOCTYPE html>
<html>
<head>
<title>{{title}}</title>
</head>
<body>
<h1>Welcome to {{title}}!</h1>
</body>
</html>问题二：渲染不完全
在使用模板引擎时，有时会出现渲染不完全的情况，这是因为 Express.js 默认情况下不会等待异步操作完成后再渲染模板。为了解决这个问题，可以使用回调函数或 Promise 对象来控制模板渲染的顺序，如下所示：
// javascriptcn.com 代码示例
app.get('/', function(req, res) {
db.getData(function(err, data) {
if (err) {
console.log(err);
res.render('error', {message: err.message});
} else {
res.render('index', {title: data.title, content: data.content});
}
});
});以上代码会从数据库中获取文章的标题和内容，然后将它们传递给模板引擎。如果获取数据发生错误，则渲染错误页面；否则将数据渲染到 index 页面。
总结
以上就是解决 Express.js 中的模板渲染问题的方法，包括添加全局变量、控制模板渲染的顺序等。在实际开发中，需要根据具体情况选择合适的方法解决问题。同时，还需注意模板引擎的语法和用法，以免出现问题。
来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/653e09cd7d4982a6eb79f8a0