YogeshChauhan . com

Pre-defined DatePipe format options in Angular 9

in Angular on October 29, 2020

What does DatePipe do?

DatePipe formats a date value according to locale rules.


{{ value_expression | date [ : format [ : timezone [ : locale ] ] ] }}


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

DatePipe Pre-defined format options Angular 9
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


Most Read

#1 How to check if radio button is checked or not using JavaScript? #2 Solution to “TypeError: ‘x’ is not iterable” in Angular 9 #3 How to add Read More Read Less Button using JavaScript? #4 How to uninstall Cocoapods from the Mac OS? #5 How to Use SQL MAX() Function with Dates? #6 PHP Login System using PDO Part 1: Create User Registration Page

Recently Posted

Jun 16 What are Stored Procedures for SQL Server? Jun 16 What are Class Constants in PHP? Jun 15 A short basic guide on states in React Jun 15 How to define constants in PHP? Jun 15 How to define visibility for a property in PHP? Jun 15 How to use @if and @else in SCSS?

You might also like these

What’s new in WordPress 5.5?WordPressHow to define visibility for a property in PHP?PHPStyling Lists with CSSCSSFew more :nth-child examples in CSSCSSHow to create Glowing Text using CSS?CSSHow to enable GD library support for PHP on windows server?PHP