使用EJS模板引擎在Express中动态生成内容的指南

什么是模板引擎

模板引擎是一种用于动态生成HTML、XML等内容的工具或框架。它允许开发者将数据与HTML模板结合，以生成最终的页面内容。通常，模板引擎会使用一种特定的语法来表示动态数据和逻辑，然后将这些模板与实际数据进行渲染，生成最终的输出。

模板引擎的主要作用是简化动态内容的生成过程，并提高页面的可维护性。它们通常支持一些基本的逻辑控制，如条件判断和循环，以便根据不同情况生成不同的输出。常见的模板引擎包括Mustache、Handlebars、EJS等，它们各自具有不同的特性和语法。

ejs 简介

ejs（Embedded JavaScript templating）是一种流行的模板引擎，支持在nodejs和浏览器环境上使用。它允许开发者使用JavaScript代码嵌入HTML模板中，以便根据需要动态生成内容。

ejs 的语法简单易懂，类似于普通的HTML标记，但可以使用<%= %>标签来插入JavaScript代码，<% %>标签来执行JavaScript代码，以及<%- %>标签来插入未经转义的HTML内容。这使得ejs非常灵活，可以方便地处理各种动态内容的生成需求。

安装

npm install ejs

使用

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

// 设置模板引擎
app.set('view engins', 'ejs');

// 设置模板目录
app.set('views', './views');

app.get('/', (req, res) => {
  // 传递数据
  const data = {
    title: "EJS DEMO"
  };

  // 渲染模板，这里表明在 / 路径下渲染的是 index.ejs 模板
  res.render('index', data);
});

app.listen(3000, () => {
  console.log('http:127.0.0.1:3000')
});

ejs 基础使用

获取 res.render() 方法传递来的数据

<%= title %>

通过在 <%= %> 标签中直接写上需要使用的参数即可。

循环

<% users.forEach(function(user){ %>
  <%= user.name %>
<% }); %>

这里主要说明的还是在 express 中使用 ejs，具体的 ejs 的使用查看EJS文档。

参考

- https://ejs.bootcss.com/