上一篇文章我们已经讲到了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()方法的更多相关文章

  1. JavaScript模板引擎artTemplate.js——template.compile()方法

    template.compile(source, options) source:必传,渲染模板的内容. options:可选,通常不传.(其实是我还没研究明白) return:一个渲染函数. 示例如 ...

  2. JavaScript模板引擎artTemplate.js——template()方法

    template(id, data)方法: id:必传,渲染模板的id. data:可选,一个Object对象. return:传data—>渲染完成html代码:不传data—>一个渲染 ...

  3. JavaScript模板引擎artTemplate.js——两种方法实现性别的判定

    template.helper(name, callback) name:必传,辅助事件的名称. callback:必传,辅助事件的回调函数. return:undefined 所谓的辅助事件,主要用 ...

  4. JavaScript模板引擎artTemplate.js——为什么使用模板引擎?

    作为一个工作一年的菜鸟,在公司做了几个外包项目,也接触到了不同形式的web开发.其实也没多少,就是javaweb开发和HTML5移动开发,这两者在页面展示的时候的解决方案还是有所不同的. 1.vo+e ...

  5. JavaScript模板引擎artTemplate.js——如何引入模板引擎?

    artTeamplate.js在github上的地址:artTemplate性能卓越的js模板引擎 引入模板引擎,就是引入外部javascript啦,并且artTemplate.js不依赖其他第三方库 ...

  6. JavaScript模板引擎artTemplate.js——是否编码输出html字符

    template.config(name, value)方法用于更改引擎的默认配置. 其中字段escape,类型为boolean,默认为true. 首先,我们不修改配置信息输出一段带有html标签的字 ...

  7. JavaScript模板引擎artTemplate.js——结语

    再次首先感谢模板的作者大神,再次放出github的地址:artTemplate性能卓越的js模板引擎 然后感谢博客园的一位前辈,他写的handlebars.js模板引擎教程,对我提供了很大的帮助,也是 ...

  8. JavaScript模板引擎artTemplate.js——引入子模板

    之前的例子都是单一结构的对象,如果遇到复杂对象结构,我们可以通过引入子模板来实现html的渲染. 依旧以之前的数据作为例子: <div id="content">< ...

  9. 探究Javascript模板引擎mustache.js使用方法

    这篇文章主要为大家介绍了Javascript模板引擎mustache.js使用方法,mustache.js是一个简单强大的Javascript模板引擎,使用它可以简化在js代码中的html编写,压缩后 ...

随机推荐

  1. JavaScript 垃圾回收

    在公司经常会听到大牛们讨论时说道内存泄露神马的,每每都惊羡不已,最近精力主要用在了Web 开发上,读了一下<JavaScript高级程序设计>(书名很唬人,实际作者写的特别好,由浅入深)了 ...

  2. ES6笔记(5)-- Generator生成器函数

    系列文章 -- ES6笔记系列 接触过Ajax请求的会遇到过异步调用的问题,为了保证调用顺序的正确性,一般我们会在回调函数中调用,也有用到一些新的解决方案如Promise相关的技术. 在异步编程中,还 ...

  3. “RazorEngine.Templating.TemplateCompilationException”类型的异常在 RazorEngine.NET4.0.dll 中发生,但未在用户代码中进行处理

    错误信息: "RazorEngine.Templating.TemplateCompilationException"类型的异常在 RazorEngine.NET4.0.dll 中 ...

  4. [python] File path and system path

    1. get files in the current directory with the assum that the directory is like this: a .py |----dat ...

  5. GET command找不到

    谷歌的: On running a cronjob with get command, I was getting the following error. /bin/sh: GET: command ...

  6. 如何在VS 2010中使用 VS2013的解决方案(转)

    今天要用VS2010打开VS2013,一直觉得VS2010到VS2012只是界面上扁平化的改变,平台工具集有改变但很大程度上可能向上兼容.在网上搜了一些文章,其中有一篇说到一个观点:        从 ...

  7. activiti工作流的web流程设计器整合视频教程 SSM 和 独立部署

    本视频为activiti工作流的web流程设计器整合视频教程 整合Acitiviti在线流程设计器(Activiti-Modeler 5.21.0 官方流程设计器) 本视频共讲了两种整合方式 1. 流 ...

  8. 【项目管理】图解GitHub基本操作

    一.注册并登陆到github网站 1.1.打开github网站首页(https://github.com/) 1.2.注册一个自己的github账号 创建账户后再验证自己的邮箱,然后就可以登陆到git ...

  9. 菜鸟快飞之JavaScript函数

    1.复制变量值 在说函数前,我觉得需要先说说关于变量值的复制,以便后面的理解. 复制基本类型的值: 当一个变量复制另外一个值为基本类型的变量时,两个变量可以参与任何操作而不会互相影响 var num1 ...

  10. React Native之 ScrollView介绍和使用

    前言 学习本系列内容需要具备一定 HTML 开发基础,没有基础的朋友可以先转至 HTML快速入门(一) 学习 本人接触 React Native 时间并不是特别长,所以对其中的内容和性质了解可能会有所 ...