文章目录
介绍
art-template 是一个简约、超快的模板引擎。
安装
npm install art-template --save
渲染模板
var template = require('art-template'); var html = template(__dirname + '/tpl-user.art', { user: { name: 'aui' } });
语法
标准语法
{{if user}} <h2>{{user.name}}</h2> {{/if}}
原始语法
<% if (user) { %> <h2><%= user.name %></h2> <% } %>
输出
{{value}} {{data.key}} {{data['key']}} {{a ? b : c}} {{a || b}} {{a + b}}
原文输出
{{@ value }}
条件
{{if value}} ... {{/if}} {{if v1}} ... {{else if v2}} ... {{/if}}
循环
{{each target}} {{$index}} {{$value}} {{/each}}
变量
{{set temp = data.sub.content}}
模板继承
{{extend './layout.art'}} {{block 'head'}} ... {{/block}}
<!--layout.art--> <!doctype html> <html> <head> <meta charset="utf-8"> <title>{{block 'title'}}My Site{{/block}}</title> {{block 'head'}} <link rel="stylesheet" href="main.css"> {{/block}} </head> <body> {{block 'content'}}{{/block}} </body> </html>
<!--index.art--> {{extend './layout.art'}} {{block 'title'}}{{title}}{{/block}} {{block 'head'}} <link rel="stylesheet" href="custom.css"> {{/block}} {{block 'content'}} <p>This is just an awesome page.</p> {{/block}}
子模版
{{include './header.art'}} {{include './header.art' data}}
过滤器
template.defaults.imports.dateFormat = function(date, format){/*[code..]*/}; template.defaults.imports.timestamp = function(value){return value * 1000}; {{date | timestamp | dateFormat 'yyyy-MM-dd hh:mm:ss'}}
和express结合使用
安装
npm install --save art-template npm install --save express-art-template
例子
var express = require('express'); var app = express(); // view engine setup app.engine('art', require('express-art-template')); app.set('view', { debug: process.env.NODE_ENV !== 'production' }); app.set('views', path.join(__dirname, 'views')); app.set('view engine', 'art'); // routes app.get('/', function (req, res) { res.render('index.art', { user: { name: 'aui', tags: ['art', 'template', 'nodejs'] } }); });
使用步骤
