DatePipelink

使用说明link

当输入值发生变化时，该管道的结果并不会改变。如果不想在每个变更检测周期中都强制重新格式化该日期，请把日期看做一个不可变对象， 当需要让该管道重新运行时，请赋给它一个新的对象，以更改它的引用。

The result of this pipe is not reevaluated when the input is mutated. To avoid the need to reformat the date on every change-detection cycle, treat the date as an immutable object and change the reference when the pipe needs to run again.

Pre-defined format optionslink

'fullTime': 等价于 'h:mm:ss a zzzz' (9:03:01 AM GMT+01:00).

自定义格式选项link

Custom format optionslink

You can construct a format string using symbols to specify the components of a date-time value, as described in the following table. Format details depend on the locale. Fields marked with (*) are only available in the extra data set for the given locale.

请注意，时区校正不适用于没有时间部分的 ISO 字符串，例如“2016-09-19”

格式范例link

Format exampleslink

下面这些例子会把日期转换成多种格式。 这里假设 dateObj 是个 JavaScript 的 Date 对象： 2015 年 6 月 15 日 21 时 43 分 11 秒， 使用的是 en-US 区域的当地时间。

These examples transform a date into various formats, assuming that dateObj is a JavaScript Date object for year: 2015, month: 6, day: 15, hour: 21, minute: 43, second: 11, given in the local time for the en-US locale.

      
        content_copy
      
      {{ dateObj | date }}               // output is 'Jun 15, 2015'
{{ dateObj | date:'medium' }}      // output is 'Jun 15, 2015, 9:43:11 PM'
{{ dateObj | date:'shortTime' }}   // output is '9:43 PM'
{{ dateObj | date:'mm:ss' }}       // output is '43:11'
    

使用范例link

Usage examplelink

下列组件借助一个日期管道来以不同的格式显示当前日期。

The following component uses a date pipe to display the current date in different formats.

      
        content_copy
      
      @Component({
 selector: 'date-pipe',
 template: `<div>
   <p>Today is {{today | date}}</p>
   <p>Or if you prefer, {{today | date:'fullDate'}}</p>
   <p>The time is {{today | date:'h:mm a z'}}</p>
 </div>`
})
// Get the current date and time as a date-time value.
export class DatePipeComponent {
  today: number = Date.now();
}