模板引擎art template
一、模板引擎基础概念
1.模板引擎:第三方模块
2.art-template模板引擎
在命令行工具中使用npm install art-template 命令进行下载;
使用const template = require ('art-template')引入模板引擎;
高速模板引擎要拼接的数据和模板在哪 const html = tempalte('模板路径',数据);
使用模板语法告诉模板引擎,模板与数据应该如何进行拼接。
3.代码示例
//导入模板引擎模块
const template = require('art-template');
//将特定模板与特定数据进行拼接
const html = template('./views/index.art',{
data : {
name : '张三',
age : 20
}
});
<div>
<span>{{data.name}}</span>
</div>
二、模板引擎语法
1.模板语法
art-template同时支持两种模板语法:标准语法和原始语法。
标准语法可以让模板更容易读写,原始语法具有强大的逻辑处理能力。
标准语法{{数据}
原始语法<%=数据%>
2.输出
将某项数据输出在模板中,标准语法和原始语法如下:
<h2>{{value}}</h2>
<h2><%= value %></h2>
3.原文输出
如果数据中携带HTML标签,默认模板引擎不会解析标签,会将其转义后输出。
标准语法{{@数据}
原始语法<%-数据%>
<h2>{{@value}}</h2>
<h2><%- value %></h2>
4.条件判断
标准语法
{{if 条件}} ... {{/if}}
{{if vl}}...{{else if v2}}...{{/if}}
原始语法
<% if (value) { %> ... <%} else if (v2) { %> ... <%} %>
5.循环
标准语法{{each 数据}}
原始语法<% for(){%><%}%>
{{each target}}
{{$index}} {{$value}}
{{/each}}
<% for(var i=0; i<target.length;i++){%>< = i %}%> <%= target[i]%>
<%}%>
6.子模板
使用子模板可以将网站公共区块(头部、底部)抽离到单独的文件中。
标准语法{{include '模板'}}
原始语法<%include('模板')%>
{{include './header.art'}}
<% include ('./header.art') %>
7.模板继承
8.模板继承示例
<!doctype html>
<html>
<head>
<meat charset="utf-8">
<title>HTML</title>
</head>
<body>
{{block 'content'}}{{/block}}
</body>
</html>
{{extend './layout.ary'}}
{{block 'head'}} <link rel="stylesheet" href="custom.css"> {{/block}}
{{block 'content'}} <p>This is just an awesome page.</p>{{/block}}
9.模板配置
向模板中导入变量template.defaults.imports.变量名=变量值;
设置模板根目录template.defaults.root=模板目录
设置模板默认后template.default.extname='.art'ingmoding
三、第三方模块router
功能:实现路由
使用步骤:获取路由对象、调用旅游对象提供的方法创建路由、启用路由,使路由生效
const getRouter = require('router')
const router = getRouter();
router.get=('/add',(req,res) => {
res.end('Hello World')
})
server.on('request',(req,res) => {
router(req,res)
})