AngularJS | date Filter (original) (raw)

Last Updated : 21 Jan, 2022

AngularJS date filter is used to convert a date into a specified format. When the date format is not specified, the default date format is ‘MMM d, yyyy’.
Syntax:

{{ date | date : format : timezone }}

Parameter Values: The date filter contains format and timezone parameters which is optional.
Some common values used in format are as follow:

Some predefined values for format are as follow:

Example 1: This example display the date in given format.

html

<!DOCTYPE html>

< html >

`` < head >

`` < title >Date Filter</ title >

`` < script src =

`` </ script >

`` </ head >

`` < body >

`` < div ng-app = "gfgApp" ng-controller = "dateCntrl" >

< p >{{ today | date : "dd.MM.y" }}</ p >

`` </ div >

`` < script >

`` var app = angular.module('gfgApp', []);

`` app.controller('dateCntrl', function($scope) {

`` $scope.today = new Date();

`` });

`` </ script >

`` </ body >

</ html >

Output:

07.05.2019

Example 2: This example display the time in specified format.

html

<!DOCTYPE html>

< html >

`` < head >

`` < title >Date Filter</ title >

`` < script src =

`` </ script >

`` </ head >

`` < body >

`` < div ng-app = "gfgApp" ng-controller = "dateCntrl" >

< p >{{ today| date : 'mediumTime'}}</ p >

`` </ div >

`` < script >

`` var app = angular.module('gfgApp', []);

`` app.controller('dateCntrl', function($scope) {

`` $scope.today = new Date();

`` });

`` </ script >

`` </ body >

</ html >

Output:

2:37:23 AM

Example 3: This example display the date in specified format.

html

<!DOCTYPE html>

< html >

`` < head >

`` < title >Date Filter</ title >

`` < script src =

`` </ script >

`` </ head >

`` < body >

`` < div ng-app = "gfgApp" ng-controller = "dateCntrl" >

< p >{{ today| date }}</ p >

`` </ div >

`` < script >

`` var app = angular.module('gfgApp', []);

`` app.controller('dateCntrl', function($scope) {

`` $scope.today = new Date();

`` });

`` </ script >

`` </ body >

</ html >

Output:

May 7, 2019

Similar Reads

AngularJS Basics