material design Angular2 dateformat not working dd/mm/yyyy

Question

I am using Angular2 material-design datepicker but when I select any date is throws an error "The specified value does not conform to required standard
"yyyy-MM-dd". I have tried to amend the locale but to no avail.

HTML

  <div>

 <md-input-container>
  <input mdInput [mdDatepicker]="picker" placeholder="Date" 
  formControlName="dateOfPurchase" ngDefaultControl 
  [formControl]="dtPurchase" [(ngModel)]="dateOfPurchase" required 
  type="date" name="dateOfPurchase" id="dateOfPurchase">
  <button mdSuffix [mdDatepickerToggle]="picker"></button>
 </md-input-container>
 <md-datepicker #picker></md-datepicker>

  </div>

Typescript

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

constructor(private dateAdapter: DateAdapter<Date>)
{
    this.dateAdapter.setLocale('gb');
    this.dtPurchase= new FormControl();
}

Any help appreciated.

@Nehal

Your suggestion on the example works but error still persists - see pic below