利用Angular Pipe实现时间格式化

2019-06-17  本文已影响0人  工程师INNOV

Typescript和Javascript的Date对象非常灵活,可以输出一些不同类型的格式化字串显示。

例如:

console.log(new Date('2019-01-01').toString()) //输出为 Tue Jan 01 2019 08:00:00 GMT+0800 (中国标准时间)

console.log(new Date('2019-01-01').d.toLocaleDateString())  //输出为 2019/1/1

然而,Date对象没有完整的格式化输出能力。例如,上文原生方法,无法输出"2019-01-01"

因此开发者往往需要自行实现Date的格式化输出。

******

Angular的DatePipe实现了非常方便的时间格式化显示,在html页面中可以直接显示不同格式的时间。语法形式为 date_expression | date[:format[:timezone[:locale]]]

例如 {{today | date:'yyyy-MM-dd'}}

参考文档只介绍了如何在html中打印输出,我们可以更进一步。

利用DatePipe实现Date对象转化为格式化字串。具体做法

1、在*.module.ts中引入Datepipe

     providers: [DatePipe],

2、在*.component.ts中使用。

constructor(public datepipe:DatePipe) {}

……

let s = this.datepipe.transform(new Date('2019-01-01'),'yyyy-MM-dd');

console.log(s)  //输出为 2019-01-01

参考

DatePipe

上一篇 下一篇

猜你喜欢

热点阅读