JavaScript模板引擎artTemplate.js——template.helper()方法
上一篇文章我们已经讲到了helper()方法,但是上面的例子只是一个参数的写法,如果是多个参数,写法就另有区别了。
<div id="user_info"></div>
<script src="../js/template.js" type="text/javascript" charset="utf-8"></script>
<script type="text/html" id="user_tmpl">
<div>姓名:<span>{{name}}</span></div>
<div>性别:
<span>{{if sex==0}}女{{else}}男{{/if}}</span>
</div>
<div>性别:<span>{{getSexName name sex}}</span></div>
<div>学校:<span>{{school}}</span></div>
</script>
<script type="text/javascript">
var data = {
name: "小明",
sex: 1,
school: "新华小学"
};
template.helper("getSexName", function(arg1, arg2) {
if (arg2 == "0") {
return "女" + arg1;
} else {
return "男" + arg1;
}
});
var user = template("user_tmpl", data);
document.getElementById("user_info").innerHTML = user;
</script>
我们注意到,最主要的区别在于调用。一个参数调用的写法可以是{{value | eventName}},多个参数则是{{eventName value01 value02}},并且单个参数也可以{{eventName value}}。可以传多个参数,为我们处理更加复杂的数据,提供了方便快捷的途径。
JavaScript模板引擎artTemplate.js——template.helper()方法的更多相关文章
- JavaScript模板引擎artTemplate.js——template.compile()方法
template.compile(source, options) source:必传,渲染模板的内容. options:可选,通常不传.(其实是我还没研究明白) return:一个渲染函数. 示例如 ...
- JavaScript模板引擎artTemplate.js——template()方法
template(id, data)方法: id:必传,渲染模板的id. data:可选,一个Object对象. return:传data—>渲染完成html代码:不传data—>一个渲染 ...
- JavaScript模板引擎artTemplate.js——两种方法实现性别的判定
template.helper(name, callback) name:必传,辅助事件的名称. callback:必传,辅助事件的回调函数. return:undefined 所谓的辅助事件,主要用 ...
- JavaScript模板引擎artTemplate.js——为什么使用模板引擎?
作为一个工作一年的菜鸟,在公司做了几个外包项目,也接触到了不同形式的web开发.其实也没多少,就是javaweb开发和HTML5移动开发,这两者在页面展示的时候的解决方案还是有所不同的. 1.vo+e ...
- JavaScript模板引擎artTemplate.js——如何引入模板引擎?
artTeamplate.js在github上的地址:artTemplate性能卓越的js模板引擎 引入模板引擎,就是引入外部javascript啦,并且artTemplate.js不依赖其他第三方库 ...
- JavaScript模板引擎artTemplate.js——是否编码输出html字符
template.config(name, value)方法用于更改引擎的默认配置. 其中字段escape,类型为boolean,默认为true. 首先,我们不修改配置信息输出一段带有html标签的字 ...
- JavaScript模板引擎artTemplate.js——结语
再次首先感谢模板的作者大神,再次放出github的地址:artTemplate性能卓越的js模板引擎 然后感谢博客园的一位前辈,他写的handlebars.js模板引擎教程,对我提供了很大的帮助,也是 ...
- JavaScript模板引擎artTemplate.js——引入子模板
之前的例子都是单一结构的对象,如果遇到复杂对象结构,我们可以通过引入子模板来实现html的渲染. 依旧以之前的数据作为例子: <div id="content">< ...
- 探究Javascript模板引擎mustache.js使用方法
这篇文章主要为大家介绍了Javascript模板引擎mustache.js使用方法,mustache.js是一个简单强大的Javascript模板引擎,使用它可以简化在js代码中的html编写,压缩后 ...
随机推荐
- RabbitMQ Config
默认访问地址:http://localhost:15672/ 要想修改内网访问: %APPDATA%\RabbitMQ\ 目录下添加文件 rabbitmq.config [ {rabbit, [%% ...
- linux(十三)__vsftpd服务器
rpm -qa |grep vsftpd yum search vsftpd yum install vsftpd 查看是否已经启动: service vsftpd status 启动: servic ...
- JqueryDataTable的使用(.Net平台)
上一篇随笔提到了MvcPager,最近用到了一款前端JQ插件------DataTable(简称DT),很好用. DT是一款前端插件,和后端完全分离开,就这点来看,我就特别喜欢. 一.使用DT,需要以 ...
- 总结js常用函数和常用技巧(持续更新)
学习和工作的过程中总结的干货,包括常用函数.常用js技巧.常用正则表达式.git笔记等.为刚接触前端的童鞋们提供一个简单的查询的途径,也以此来缅怀我的前端学习之路. PS:此文档,我会持续更新. Aj ...
- Linux命令-文件文本操作grep
文件文本操作 grep 在文件中查找符合正则表达式条件的文本行 cut 截取文件中的特定字段 paste 附加字段 tr 字符转换或压缩 sort 调整文本行的顺序,使其符合特定准则 uniq 找出重 ...
- BCS datetime 时间区间问题
BCS 整合sql表时发现以下问题: datetime字段在列表中带了时区,比如插入12-6号的数据,在sql中显示的是12-5 date类型字段无法正确识别,插入成功但报错 LobSystem (外 ...
- iOS之UI组件整理
作者:神兽gcc 授权本站转载. 最近把iOS里的UI组件重新整理了一遍,简单来看一下常用的组件以及它们的实现.其实现在这些组件都可以通过Storyboard很快的生成,只是要向这些组件能够变得生动起 ...
- iOS空心圆下载进度指示器控件
self.layer = [CAShapeLayer layer]; self.layer.frame = CGRectMake(, , , ); self.layer.position = self ...
- react native初步常见问题
首先按照资料一步步搭建环境运行,然后成功了,很激动,可是,安卓就是没这么容易成功,还是太年轻了 could not get batchedbridge, make sure your bundle i ...
- SQLSERVER常见系统函数之字符串函数(一)
好久没有写博客了,这段时间准备写一下字符串函数 QQ群: 499092562:欢迎交流 字符串函数: 1.LEN(需要获取长度的字符串) 返回:字符串的长度 示例: SELECT LEN('小搬运工很 ...