如何使用EJS模板引擎直接打印变量？

在EJS（Embedded JavaScript）模板引擎中打印变量是一个非常基础且常见的操作。EJS将数据与模板结合生成HTML内容，这在服务器端渲染（SSR）应用中非常实用。

基本语法

在EJS中，如果你想在HTML模板中直接输出一个变量的值，你可以使用 <%= %> 标签。这个标签会对包含的JavaScript表达式进行求值，并将结果转换为字符串后插入到模板输出中。例如：

ejs
<p>用户名: <%= username %></p>

在这个例子中，username 是一个变量，它的值将被直接插入到 <p> 标签中。

示例

假设我们有一个简单的Express.js服务器，我们想在服务器端使用EJS模板引擎来渲染一个页面，显示用户的名字。我们可以这样设置：

设置Express和EJS

安装Express和EJS：

bash
npm install express ejs

设置Express以使用EJS作为模板引擎：

javascript
const express = require('express');
const app = express();

app.set('view engine', 'ejs');

创建EJS模板

在项目的 views 文件夹中创建一个叫 profile.ejs 的文件，内容如下：

ejs
<!DOCTYPE html>
<html>
<head>
    <title>User Profile</title>
</head>
<body>
    <h1>Welcome to your profile!</h1>
    <p>用户名: <%= username %></p>
</body>
</html>

渲染模板

在Express中，当请求 /profile 路径时，渲染我们的 profile.ejs 模板，并传递一个包含用户名的对象：
```
javascript
app.get('/profile', (req, res) => {
    res.render('profile', { username: '张三' });
});
```
这里，当用户访问 /profile 时，他们会看到一个页面，上面写着 "用户名: 张三"。

总结

通过使用 <%= %> 标签，EJS允许你在HTML模板中直接输出JavaScript变量。这使得动态生成基于用户数据的内容变得非常直接和高效。在实际项目中，这种方式可以用来显示用户信息、文章内容、动态表格数据等。

2024年7月20日 03:48 回复

1个答案

基本语法

示例

总结

你的答案