使用模板引擎

使用模板引擎

以下代码将 Jade 设置为模板引擎。 （注：截至 2015 年 12 月，Jade 已更名为 pug。）

const express = require('express');  //Imports the express module
const app = express();  //Creates an instance of the express module

const PORT = 3000; //Randomly chosen port

app.set('view engine','jade'); //Sets jade as the View Engine / Template Engine
app.set('views','src/views'); //Sets the directory where all the views (.jade files) are stored.

//Creates a Root Route
app.get('/',function(req, res){
    res.render('index');  //renders the index.jade file into html and returns as a response. The render function optionally takes the data to pass to the view.
});

//Starts the Express server with a callback
app.listen(PORT, function(err) {
    if (!err) {
        console.log('Server is running at port', PORT);
    } else {
        console.log(JSON.stringify(err));
    }
});

同样，也可以使用其他模板引擎，例如 Handlebars（hbs）或 ejs。记得也要模板引擎。对于 Handlebars，我们使用 hbs 包，对于 Jade，我们有 jade 包，对于 EJS，我们有 ejs 包。

EJS 模板示例

使用 EJS（与其他快速模板一样），你可以运行服务器代码并从 HTML 访问服务器变量。
在 EJS 中，使用“<%”作为开始标记，使用“%>”作为结束标记，使用 <%=var_name%> 可以访问渲染参数传递的变量
。例如，如果服务器代码中有供应数组，则
可以使用

<h1><%= title %></h1>
   <ul>
<% for(var i=0; i<supplies.length; i++) { %>
    <li>
        <a href='supplies/<%= supplies[i] %>'>
            <%= supplies[i] %>
        </a>
    </li>
<% } %>

正如你在每次在服务器端代码和 HTML 之间切换时所见，你需要关闭当前的 EJS 标记并稍后打开一个新标记，这里我们想在 for 命令中创建 li，因此我们需要关闭 EJS 标记在 for 的末尾并为花括号创建新标签
另一个例子
如果我们想将输入默认版本作为变量从服务器端我们使用 <%=
例如：

 Message:<br>
<input type="text" value="<%= message %>" name="message" required>

这里从服务器端传递的消息变量将是你输入的默认值，请注意，如果你没有从服务器端传递消息变量，EJS 将抛出异常。你可以使用 res.render('index', {message: message}); 传递参数（对于名为 index.ejs 的 ejs 文件）。

在 EJS 标签中，你还可以使用 if，while 或你想要的任何其他 javascript 命令。