zoukankan      html  css  js  c++  java
  • 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;
  • 相关阅读:
    ABAP-年月期间搜索帮助
    Others-Goldengate 数据同步
    ABAP-语音输出
    ABAP-ALV报表导出格式恢复初始画面
    ABAP-动态创建DATABASE/FUNCTION(风险)
    JDK 12 安装
    级数判敛--转自高教
    一文搞懂 JavaScript 中 DOM 相关的距离
    你应该知道的前端编程利器 VS Code
    js变量提升与函数提升的详细过程
  • 原文地址:https://www.cnblogs.com/bjlhx/p/6784643.html
Copyright © 2011-2022 走看看