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

时间:2023-03-21 21:43:01

上一篇文章我们已经讲到了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}}。可以传多个参数,为我们处理更加复杂的数据,提供了方便快捷的途径。