date 这个过滤器可以把日期类型数据转换成你想要的格式,在我的 ShowController 里面,shows 里面的每个项目都有一个叫 updated 的属性,它的值是时间戳,也就是从 1970 年 1 月 1 号开始到一个时间之间的秒数。
再打开 index.html ... 我们已经把这个 updated 属性的值绑定到了这里 ... 就是这个更新于后面,使用双花括号形式的绑定。在浏览器上会显示出这个属性里的值。下面我们可以使用 date 这个过滤器去改造一下这个时间的显示。
不过在改造前,我们需要转化一下这个时间戳,因为 JavaScript 只认识 从 1970 年 1 月 1 号到一个时间之间的毫秒数,所以,我们需要把这个秒数转化成毫秒 ... 1 秒 等于 1000 毫秒,所以,需要让这个属性的值先乘以 1000 ... 然后再去应用 date 过滤器 .. 在后面输入一个竖线 ... 接着是过滤器的名字 ... date .. . 保存 ..
默认会用这样的形式来显示日期跟时间 ... 前面是月份的英文简写,然后是日子,接着是年 ... 我们完全可以按照自己的需求去定制这个时间的显示的形式。Angular 也提供了几种预先定义好的显示日期跟时间的形式 ... 这个形式都有一个名字 ... 默认你看到的应该是 medium 形式 .. 我们再试一下其它的 ...
在 date 后面加上一个冒号 ... 然后再试一下 'short' .. 保存 ... 这样会用月日年,加上时间,还有表示上午跟下午的字符来显示 ..
再试一下 longDate ... 会用完整的英文的月份,加上日子还有年度 ....
再试一下 shortTime ... 这种格式只会显示几点 ...
这些预先定义的格式如果不能满足我们的需求,也可以自己去定制一种显示的格式。 比如我想用年月日,再加上时间的形式 .. 先输入一个 yyyy ,它表示的是四位数的年 ... 中间一个横线,再加上两个大写的 M ,它表示用两位数字表示月份 .. 后面再加上一个横线,然后用两个小写的 d 表示日子 ...
再用一个逗号 ... 用两位数字表示小时,可以使用两个大写的 H,它可以用 24 进制来表示时间 ... 中间用一个冒号,再去连接表示分钟的字符 ... 用两个小写的 m ...
{{ show.updated * 1000 | date: 'yyyy-MM-dd, HH:mm' }}
保存 ... 现在显示的日期跟时间就是我们自己设计好的形式 ... 四位数字的年,两位数字的月份还有日期 ... 另外还有一个 24 小时进制的时间 ...
还有很多表示日期跟时间的用法,你可以参考 Angular 官方网站上面的 date 过滤器的相关文档。