• js-template-art【四】通过helper方法注册,调用外部方法


    一、语法

    模板代码中调用外部函数,需要通过helper方法注册

    template.helper(name, callback)

    二、使用【实例】

    原文:http://blog.csdn.net/u011413061/article/details/50498470

    前提:replace使用

    html代码:

    <!--数据容器-->
    <div id="content"></div>
    <!--/数据容器-->
    
    <script id="test" type="text/html">
        /*对time对象进行格式化*/
        {{time | dateFormat:'yyyy年 MM月 dd日 hh:mm:ss'}}
    </script>

    javascript代码

    /** 
     * 对日期进行格式化, 
     * @param date 要格式化的日期 
     * @param format 进行格式化的模式字符串
     *     支持的模式字母有: 
     *     y:年, 
     *     M:年中的月份(1-12), 
     *     d:月份中的天(1-31), 
     *     h:小时(0-23), 
     *     m:分(0-59), 
     *     s:秒(0-59), 
     *     S:毫秒(0-999),
     *     q:季度(1-4)
     * @return String
     * @author yanis.wang
     * @see http://yaniswang.com/frontend/2013/02/16/dateformat-performance/
     */
    template.helper('dateFormat', function (date, format) {
    
        date = new Date(date); //新建日期对象
    
        /*日期字典*/
        var map = {
            "M": date.getMonth() + 1, //月份 
            "d": date.getDate(), //
            "h": date.getHours(), //小时 
            "m": date.getMinutes(), //
            "s": date.getSeconds(), //
            "q": Math.floor((date.getMonth() + 3) / 3), //季度 
            "S": date.getMilliseconds() //毫秒 
        };
    
        /*正则替换*/
        format = format.replace(/([yMdhmsqS])+/g, function(all, t){
            var v = map[t];
            if(v !== undefined){
                if(all.length > 1){
                    v = '0' + v;
                    v = v.substr(v.length-2);
                }
                return v;
            }
            else if(t === 'y'){
                return (date.getFullYear() + '').substr(4 - all.length);
            }
            return all;
        });
    
        /*返回自身*/
        return format;
    });
    
    /*数据*/
    var data = {
        time: (new Date).toString(),
    };
    /*渲染*/
    var html = template('test', data);
    /*绑定*/
    document.getElementById('content').innerHTML = html;
  • 相关阅读:
    Counting Stars hdu
    Color it hdu
    steins;Gate
    原根
    3-idiots
    Tree
    洛谷P1352 没有上司的舞会
    洛谷P1131 时态同步
    洛谷P3177 树上染色
    Codeforces Round #617 (Div. 3)
  • 原文地址:https://www.cnblogs.com/bjlhx/p/6784643.html
Copyright © 2020-2023  润新知