What does DatePipe do?
DatePipe formats a date value according to locale rules.
Syntax
{{ value_expression | date [ : format [ : timezone [ : locale ] ] ] }}
Where
value (any) = The date expression: a Date object, a number (milliseconds since UTC epoch), or an ISO string. The parameter is required.
format (string) = The date/time components to include, using predefined options or a custom format string. It is optional. Default value is ‘mediumDate‘.
timezone (string) = A timezone offset (such as ‘+0430’), or a standard UTC/GMT or continental US timezone abbreviation. When not supplied, uses the end-user’s local system timezone. It is optional. Default is undefined.
locale (string) = A locale code for the locale format rules to use. When not supplied, uses the value of LOCALE_ID, which is en-US by default. See Setting your app locale. It is optional. Default is undefined.
Pre-defined format options
Format | equivalent to (en-US locale) |
---|---|
short | M/d/yy, h:mm a (6/15/15, 9:03 AM). |
medium | MMM d, y, h:mm:ss a (Jun 15, 2015, 9:03:01 AM) |
long | MMMM d, y, h:mm:ss a z (June 15, 2015 at 9:03:01 AM GMT+1) |
full | EEEE, MMMM d, y, h:mm:ss a zzzz (Monday, June 15, 2015 at 9:03:01 AM GMT+01:00) |
shortDate | M/d/yy (6/15/15) |
mediumDate | MMM d, y (Jun 15, 2015) |
longDate | MMMM d, y (June 15, 2015) |
fullDate | EEEE, MMMM d, y (Monday, June 15, 2015) |
shortTime | h:mm a (9:03 AM) |
mediumTime | h:mm:ss a (9:03:01 AM) |
longTime | h:mm:ss a z (9:03:01 AM GMT+1) |
fullTime | h:mm:ss a zzzz (9:03:01 AM GMT+01:00) |
Credit: Angular.io
Angular 9 date locale pipes rules time timezone