angular-material2 – Set different locale for md-datepicker

This example requires importing DateAdapter.

import {DateAdapter} from '@angular/material';

datepicker.component.html:

<md-input-container>
  <input mdInput [mdDatepicker]="picker" placeholder="Choose a date">
  <button mdSuffix [mdDatepickerToggle]="picker"></button>
</md-input-container>
<md-datepicker #picker></md-datepicker>

<p></p>
<div>
  <button md-raised-button (click)="setLocale('en')">English - US</button>
  
  <button md-raised-button (click)="setLocale('es')">Spanish</button>

  <button md-raised-button (click)="setLocale('zh')">Chinese</button>

  <button md-raised-button (click)="setLocale('nl')">Dutch</button>
  
  <button md-raised-button (click)="setLocale('bn')">Bengali</button>
  
  <button md-raised-button (click)="setLocale('hi')">Hindi</button>
  
  <button md-raised-button (click)="setLocale('ar')">Arabic</button>
</div>

datepicker.component.ts:

import {Component} from '@angular/core';
import {DateAdapter} from '@angular/material';

@Component({
  selector: 'datepicker-overview-example',
  templateUrl: './datepicker-overview-example.html',
  styleUrls: ['./datepicker-overview-example.css'],
})
export class DatepickerOverviewExample {
  
  constructor(private dateAdapter: DateAdapter<Date>) {
    this.dateAdapter.setLocale('en');   
  }
  
  setLocale(val){
    console.log(val);
    this.dateAdapter.setLocale(val); 
  }
  
}

Live demo

A list of locale language code can be found here.

if you want to reproduce, please indicate the source:
angular-material2 – Set different locale for md-datepicker - CodeDay