art-template模板引擎

最新推荐文章于 2024-04-01 09:41:32 发布

王靓靓

最新推荐文章于 2024-04-01 09:41:32 发布

阅读量88

点赞数

本文链接：https://blog.csdn.net/s_unny_wang/article/details/111908549

版权

链接: 官方文档

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'}}