DatePipe

Stable Pipe

Что делает

Форматирует дату в соответствии с правилами локали.

Как использовать

date_expression | date[:format]

NgModule

Описание

Где:

• expression — объект даты или число (миллисекунды с начала эпохи UTC) или строка в формате ISO (https://www.w3.org/TR/NOTE-datetime).
• format указывает, какие компоненты даты/времени включить. Формат может быть предопределён как показано ниже или настраиваемым, как показано в таблице.
  • 'medium': эквивалентно 'yMMMdjms' (например, Sep 3, 2010, 12:05:08 PM для en-US)
  • 'short': эквивалентно 'yMdjm' (например, 9/3/2010, 12:05 PM для en-US)
  • 'fullDate': эквивалентно 'yMMMMEEEEd' (например, Friday, September 3, 2010 для en-US)
  • 'longDate': эквивалентно 'yMMMMd' (например, September 3, 2010 для en-US)
  • 'mediumDate': эквивалентно 'yMMMd' (например, Sep 3, 2010 для en-US)
  • 'shortDate': эквивалентно 'yMd' (например, 9/3/2010 для en-US)
  • 'mediumTime': эквивалентно 'jms' (например, 12:05:08 PM для en-US)
  • 'shortTime': эквивалентно 'jm' (например, 12:05 PM для en-US)

В JavaScript будут учтены только указанные компоненты (не порядок, знаки препинания и т. д.), а детали форматирования будут зависеть от локали.

Часовой пояс отформатированного текста будет соответствовать часовому поясу локальной системы машины конечного пользователя.

Когда выражение является строкой ISO без времени (например, 2016-09-19), смещение часового пояса не применяется, и отформатированный текст будет содержать тот же день, месяц и год, что и выражение.

ПРЕДУПРЕЖДЕНИЯ:

• Этот пайп помечен как чистый, поэтому он не будет повторно вычисляться при изменении входных данных. Вместо этого пользователи должны рассматривать дату как неизменяемый объект и менять ссылку, когда пайпу нужно перевыполниться (это позволяет избежать повторного форматирования даты при каждом запуске обнаружения изменений, что является дорогостоящей операцией).
• Этот пайп использует API интернационализации. Поэтому он надёжно работает только в браузерах Chrome и Opera.

Примеры

Предполагая, что dateObj — (год: 2015, месяц: 6, день: 15, час: 21, минута: 43, секунда: 11) в локальном времени и локаль — 'en-US':

{{ 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:'mmss' }}        // output is '43:11'

@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:'jmZ'}}</p>
  </div>`
})
export class DatePipeComponent {
  today: number = Date.now();
}

экспортировано из @angular/common/index определено в @angular/common/src/pipes/date_pipe.ts