前端模板Handlerbar

在使用mustache.js时候, 遇到一些格式化时间这样的功能, 总会很麻烦.
比如:

{
"items":[
{
"title" : "标题1",
"createDate":"2016-06-10T15:48:00.000Z"
},
{
"title" : "标题2",
"createDate":"2016-06-10T18:48:00.000Z"
}
]
}
要想格式化列表里的时间createDate, 你必须要在数据对象中像这样注册一个handler:

{
items : ...
dateFromat : function(){
return moment(this.createDate).format('YYYY-MM-DD')
}
}
每次做渲染的时候都必须重复注册handler,很是麻烦.
注册完后,使用handler的时候语法也很奇葩:

{{# items}}
{{title}}
{{# dateFromat}}
{{formatDate createDate}}
{{/dateFromat}}
{{/items}}
为此, 特意google了一下. 发现了另一个语法兼容mustache的前段模板Handlerbar, 和它的名字表达的一样, 可以方便的注册一堆handler.

使用方式很简单:

1. 注册handler

Handlebars.registerHelper('formatDate', function(date) {
return moment(date).format('YYYY-MM-DD hh:mm:ss');
});

1. 渲染时调用handler

{{# items}}
{{title}}
{{formatDate createDate}}
{{/items}}

ok.

另外,它提供的Html预编译成JavaScript功能也很方便.

不愧是大型前端工程的利器.

关键字：JavaScript, tempalte, mustache

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！