Angular 2 Date Input not binding to date value Angular 2 Date Input not binding to date value typescript typescript

Angular 2 Date Input not binding to date value


Angular 2 , 4 and 5 :

the simplest way : plunker

<input type="date" [ngModel] ="dt | date:'yyyy-MM-dd'" (ngModelChange)="dt = $event">


Instead of [(ngModel)] you can use:

// view<input type="date" #myDate [value]="demoUser.date | date:'yyyy-MM-dd'" (input)="demoUser.date=parseDate($event.target.value)" />// controllerparseDate(dateString: string): Date {    if (dateString) {        return new Date(dateString);    }    return null;}

You can also choose not to use parseDate function. In this case the date will be saved as string format like "2016-10-06" instead of Date type (I haven't tried whether this has negative consequences when manipulating the data or saving to database for example).


In your component

let today: string;ngOnInit() {  this.today = new Date().toISOString().split('T')[0];}

and in your html file

<input name="date" [(ngModel)]="today" type="date" required>