Question

嘿伙计们我正在玩node.js并尝试渲染模板文件。我想出了如何呈现字符串：

var http = require('http');
var ejs = require('ejs');

var server = http.createServer(function(req, res){
    res.end(ejs.render('Hello World'));
});

server.listen(3000);

如何渲染模板文件？

Answer 1

ejs中有一个未记录的函数来渲染文件，你可以做...

ejs.renderFile(__dirname + '/template.ejs', function(err, data) {
    console.log(err || data)
})

source

Answer 2

var templateString = null;
var fs = require('fs');
var templateString = fs.readFileSync('template.ejs', 'utf-8');

然后你做你的事：

var server = http.createServer(function(req, res){
    res.end(ejs.render(templateString));
});

Answer 3

您所要做的就是将文件编译为字符串（带有可选的局部变量），如下所示：

var fs = require('fs'), ejs = require('ejs'), http = require('http'), 
         server, filePath;
filePath = __dirname + '/sample.html'; // this is from your current directory
fs.readFile(filePath, 'utf-8', function(error, content) {
  if (error) { throw error); }
  // start the server once you have the content of the file
  http.createServer(function(req, res) {
    // render the file using some local params
    res.end(ejs.render(content, {
      users: [
        { name: 'tj' },
        { name: 'mape' },
        { name: 'guillermo' }
      ]
    });  
  });
});

Answer 4

这种模式的同步版本可以将其收紧一点。

var server = http.createServer(function(req, res) {
    var filePath = __dirname + '/sample.html';
    var template = fs.readFileSync(filePath, 'utf8');
    res.end(ejs.render(template,{}));
});

请注意 readFileSync （）的使用。如果指定编码（此处为utf8），则该函数返回包含模板的字符串。

Answer 5

@ksloan的答案应该是被接受的答案。它为此目的精确地使用了ejs函数。

以下是如何使用Bluebird的示例：

var Promise = require('bluebird');
var path = require('path');
var ejs = Promise.promisifyAll(require('ejs'));

ejs.renderFileAsync(path.join(__dirname, 'template.ejs'), {context: 'my context'})
  .then(function (tpl) {
    console.log(tpl);
  })
  .catch(function (error) {
    console.log(error);
  });

为了完整起见，这里是目前接受的答案的宣传版本：

var ejs = require('ejs');
var Promise = require('bluebird');
var fs = Promise.promisifyAll(require('fs'));
var path = require('path');

fs.readFileAsync(path.join(__dirname, 'template.ejs'), 'utf-8')
  .then(function (tpl) {
    console.log(ejs.render(tpl, {context: 'my context'}));
  })
  .catch(function (error) {
    console.log(error);
  });

Answer 6

@ ksloan 的回答非常好。我也有相同的用例并且进行了一些挖掘。函数renderFile（）被重载。你最需要的是：

renderFile(path: string,data, cb)

例如：

ejs.renderFile(__dirname + '/template.ejs', dataForTemplate, function(err, data) {
console.log(err || data)
})

其中 dataForTemplate 是一个包含模板内所需值的对象。

Answer 7

将ejs.renderFile(filename, data)函数与 async-await 一起使用。

呈现HTML文件。

const renderHtmlFile = async () => {
    try {
        //Parameters inside the HTML file
        let params = {firstName : 'John', lastName: 'Doe'};
        let html = await ejs.renderFile(__dirname + '/template.html', params);
        console.log(html);
    } catch (error) {
        console.log("Error occured: ", error);
    }
}

呈现EJS文件。

const renderEjsFile = async () => {
    try {
        //Parameters inside the HTML file
        let params = {firstName : 'John', lastName: 'Doe'};
        let ejs = await ejs.renderFile(__dirname + '/template.ejs', params);
        console.log(ejs);
    } catch (error) {
        console.log("Error occured: ", error);
    }
}

Answer 8

只需将Express View引擎设置为“ ejs”

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

// template engine config
app.set("view engine", "ejs");
app.set("views", "views"); // setting the folder that has our views & it is default value even if not declared

app.get("/", (req, res, next) => {
  res.render("index");
});

当然，您需要这样设置目录：

视图（包含所有主要视图和部分视图）。
app.js（具有上述配置）。

就是这样。

在node.js中渲染ejs文件

8 个答案: