dearn44 dearn44 - 1 year ago 1725
AngularJS Question

Change format of md-datepicker in Angular Material

Angular material introduced a new date picker component found here.

I want the date returned by this component to be in the format yyy-mm-dd but I am not sure how is this done. By searching I found that

can be used, but I could not find an example of using it.

Can someone show me a working example of formatting the date returned by

Answer Source

There is a documentation for $mdDateLocaleProvider in the Angular Material docs.

angular.module('app').config(function($mdDateLocaleProvider) {
    $mdDateLocaleProvider.formatDate = function(date) {
       return moment(date).format('YYYY-MM-DD');

If you don't use moment.js, substitute the code inside formatDate for whatever you wish to use to format the date.

Here is a CodePen example based on the samples from Angular Material docs.