node08---EJS模版

Posted 672530440

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了node08---EJS模版相关的知识,希望对你有一定的参考价值。

四、模板引擎
<a href="<%= url %>"><img src="<%= imageURL %>" ></a>
数据绑定,就成为一个完整的html字符串了。
前台的模板,我们现在要学习的是后台的模板。
后台模板,著名的有两个,第一个叫做ejs; 第二个叫做jade。

是npm第三方包。

先说EJS
Embedded javascript templates
后台模板引擎
    <ul>
        <% for(var i = 0 ; i < news.length ; i++){ %>
            <li><%= news[i] %></li>
        <% } %>
    </ul>
var dictionary = {
          a:6,
          news : ["1期班太牛逼了","高薪就业","哈哈哈哈哈"]
};

14.js

/**
 * Created by Danny on 2015/9/20 16:59.
 */
var ejs = require("ejs");

//模板
var string = "好高兴啊,今天我买了iphone<%= a %>s";
//数据
var data = {
    a : 6
};
//数据绑定
var html = ejs.render(string, data);
//输出
console.log(html);

15.js

/**
 * Created by Danny on 2015/9/20 16:59.
 */
var ejs = require("ejs");
var fs = require("fs");
var http = require("http");


var server = http.createServer(function(req,res){
    fs.readFile("./views/index.ejs",function(err,data){
        //绑定模板
        var template = data.toString();
        var dictionary = {
            a:6,
            news : [
                {"title":"陈伟我爱你","count":10},
                {"title":"哈哈哈哈","count":20},
                {"title":"逗你玩儿的","count":30}
            ]
        };
        var html = ejs.render(template,dictionary);

        //显示
        res.writeHead(200,{"Content-Type":"text/html;charset=UTF8"});
        res.end(html);
    });
});

server.listen(3000);
index.ejs
<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
</head>
<body>
    <h1>好高兴啊,今天我买了一个iphone<%= a %>s</h1>
    <ul>
        <%
            for(var i = 0 ; i < news.length ; i++){
                if(news[i].count > 15){
        %>
                <li><%= news[i].title %></li>
        <%
                }
            }
        %>
    </ul>
</body>
</html>

 EJS模版效率不高,JADE引擎效率高,难度大

以上是关于node08---EJS模版的主要内容,如果未能解决你的问题,请参考以下文章

使用 Git 来管理 Xcode 中的代码片段

Node.js JavaScript 片段中的跳过代码

vscode设置vue模版

treap 模版

Vue项目搭建基础之Vue-cli模版测试

VS Code安装yo(Yeoman) 插件下载.net core 模版代码开发