模版引擎介绍

最新推荐文章于 2024-06-17 15:48:54 发布

WL磊0.0

最新推荐文章于 2024-06-17 15:48:54 发布

阅读量336

点赞数 9

文章标签： arcgis

本文链接：https://blog.csdn.net/akedf/article/details/135337406

版权

本文介绍了EJS模板引擎的基本概念，如何在Express中安装和配置EJS，创建和使用EJS模板，以及展示了常见的模板语法，如条件语句、循环语句和模板包含。

摘要由CSDN通过智能技术生成

什么是EJS模板引擎？

EJS（Embedded JavaScript）是⼀种流⾏的模板引擎，⽤于将动态数据嵌⼊到静态HTML中。 Express框架⽀持EJS，允许您轻松地创建动态Web应⽤程序，动态⽣成HTML⻚⾯，以及向⻚⾯中注⼊数据。官⽹：https://ejs.bootcss.com/

在使⽤EJS之前，您需要确保已经安装了EJS模块。您可以使⽤npm来安装它：

npm install ejs

配置Express以使⽤EJS作为默认的模板引擎。在您的Express应⽤程序中，添加以下代码：

const express = require('express');
const app = express();
// 设置EJS为模板引擎
app.set('view engine', 'ejs');

通过app.set('view engine', 'ejs')，您告诉Express使⽤EJS作为默认模板引擎。

创建⼀个EJS模板⽂件，通常保存在⼀个名为views的⽂件夹中。以下是⼀个简单的EJS模板示例，例如views/index.ejs：

 <!DOCTYPE html>
 <html>
 <head>
 <title>Express EJS模板示例</title>
 </head>
 <body>
 <h1>Hello, <%= name %>!</h1>
 </body>
 </html>

在EJS模板中，您可以使⽤来插⼊动态变量。在上述示例中，name变量将在渲染时被替换为实际的值

在Express路由处理程序中，使⽤res.render()来渲染EJS模板并传递数据：

app.get('/', (req, res) => {
 res.render('index', { name: 'Express' });
});

在这个示例中，res.render('index', { name: 'Express' })将渲染views/index.ejs模板，并将数据 { name: 'Express' }传递给模板。模板中的将被替换为"Express"。

EJS⽀持许多模板语法，包括条件语句、循环语句和模板包含等。以下是⼀些常⽤的EJS模板语法示例：

<% if (user) { %>
 <h2>Welcome, <%= user.name %>!</h2>
 <% } else { %>
 <h2>Welcome, Guest!</h2>
 <% } %>

<ul>
 <% for (let i = 0; i < items.length; i++) { %>
 <li><%= items[i] %></li>
 <% } %>
 </ul>

 <%- include('header') %>
 <h1>Page Content</h1>
 <%- include('footer') %>

关注