Skip to content

Template.js 过滤器输出 #26

@hexson

Description

@hexson

新增过滤器输出,解决需要格式化日期输出或者其他定制输出的情况。点击下载(v1.0.1)

使用过滤器

<!-- 引入js文件(v1.0.1) -->
<script src="template.min.js"></script>

<!-- html模板 -->
<script id="tpl" type="text/template">
  <p>Date: {{date | formatdate: 'yyyy-MM-dd hh:mm:ss'}}</p>
</script>
var data = {
  date: 1490233347
};

/* filter => formatdate */
template.filter('formatdate', function(date, format){
  date = new Date((date + '').length != 10 ? +date : date * 1000);
  var map = {
    M: date.getMonth()+1,
    d: date.getDate(),
    h: date.getHours(),
    m: date.getMinutes(),
    s: date.getSeconds(),
    S: date.getMilliseconds()
  };
  format = format.replace(/([yMdhmsS])+/g, function(all, m){
    var v = map[m];
    if (v !== undefined && all.length > 1){
      v = '0' + v;
      v = v.substr(v.length - 2);
      return v;
    }else if (m === 'y'){
      return (date.getFullYear() + '').substr(4 - all.length);
    }
    return all;
  });
  return format;
});

/* output html */
document.write(template('tpl', data));

API

template.filter: String name, Function filter

该方法接收两个参数,第一个为过滤器名称,第二个为自定义函数,函数内部需返回一个最终的value。调用:

<p>{{string | filterName: args...}}</p>
template.filter('filterName', function(string, args...){
  /* to do something */
  return string;
});

谢谢

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions