How to change date format using date filter in AngularJS?

By Hardik Savani | June 26, 2016 | | 2778 Viewer | Category : AngularJS


Share this post:

AngularJS provides several filter for developing. AngularJS date filter through you can change date format as you want like yyyy-mm-dd, dd-MM-yyyy, MM-dd-yyyy etc. In bellow example you could understand very well date helper to how to use date filter in Angular JS.

In this example i have one array with date(yyyy-mm-dd date format) and date format will be convert into dd-mm-yyyy using date filter.

Example

<html lang="en-US">

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>

<body>


<div ng-app="myApp" ng-controller="customersCtrl">


<table>

<tr>

<th>Language</th>

<th>Date</th>

</tr>

<tr ng-repeat="x in names">

<td>{{ x.language }}</td>

<td>{{ x.date | date: 'dd-MM-yyyy' }}</td>

</tr>

</table>


</div>


<script>

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

app.controller('customersCtrl', function($scope, $http) {

$scope.names = [

{'language': 'PHP', 'date': '2016-06-01' },

{'language': 'Laravel', 'date': '2016-06-02'},

{'language': 'Angular JS', 'date': '2016-06-05'},

];

});

</script>


</body>

</html>