art-template模板引擎

最新推荐文章于 2021-05-14 20:59:13 发布

原创最新推荐文章于 2021-05-14 20:59:13 发布 · 134 阅读

0 ·

CC 4.0 BY-SA版权

本文介绍了art-templat的使用方法，包括引入模版引擎的js文件、准备模板和数据、绑定模版与数据并渲染到页面等。还提及了其原文输出、条件判断、循环、变量、模板继承、子模板、过滤器等特性。

链接: 官方文档

art-templat

使用

引入模版引擎的js文件
准备模板

	<script type="text/html" id="">
	</script>

准备数据(从后台获取的数据)
将模版与数据进行绑定( template(模板id,数据对象) )
将得到的html结构渲染到页面
修改模板将对象的数据显示出来

原文输出

标准语法

{{@ value }}

原始语法

<%- value %>

条件判断

{{if value}} ... {{/if}}
{{if v1}} ... {{else if v2}} ... {{/if}}

循环

{{each 数组}} //也能够遍历的对象,是传入对象的属性名
    {{$index}} {{$value}} //$index表示下标 $value表示每一项
{{/each}}

{{each 数组 v i}}
    {{i}} {{v}} //i表示下标 v表示每一项
{{/each}}

变量

{{set temp = data.sub.content}}

模板继承

{{extend './layout.art'}}
{{block 'head'}} ... {{/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'}}