存档

文章标签 ‘trimpath’

编写js模板引擎：TrimPath的扩展

2010年9月9日 effect 没有评论

1.TrimPath是什么？
javascript模板引擎。

2.主要用途是？

想象一下有这么一个应用场景：在我的个人中心页面，客户端通过异步请求，去拉取自己的好友列表的裸数据，然后把这些好友展示出来。当然可以通过传统的方法，ajax请求，然后通过JS代码拼装一段字符串，然后展示在页面上的某个地方。这个方法真痛苦，有时候要处理那种单引号，双引号，会让你抓狂，及其容易出现低级失误。所以这个模板引擎就是来拯救你的。

3.基本资料和教材

http://code.google.com/p/trimpath/wiki/JavaScriptTemplates   下载地址，API，DOC等信息

http://bbs.chinaunix.net/thread-735901-1-1.html   CU上面比较详细的教程。

4.重头戏，增加扩展

假设有这么一个应用场景：注册到模板里面的某个变量是一个数组，现在要你把这个数组用中文的分号(；)连接成一个字符串。类似这样的场景很多，比如给你一个时间，格式化成相对现在的相对时间（如：5分钟前，昨天，刚刚等）。

官方提供的扩展有：default、capitalize、eat、escape、h。这些扩展的用途见：http://code.google.com/p/trimpath/wiki/JavaScriptTemplateModifiers

好了，现在回到上面的那个需求：用中文分号连接数组，其实很简单：

TrimPath.parseTemplate_etc.modifierDef.join=function(array,split){
	if(!$.isArray(array)) return '';
	split=split||'；';
	return array.join(split);
}

在你的模板里面可以这样使用：
$[arrName|join:'；']

搞定!

分类: javascript 标签: , ,
watch bleach online avatar the last airbender ncis episodes