angular-material2 md-datepicker Passing selected date value to a function using $event
Example
datepicker-overview-example.html:
<md-input-container>
<input mdInput [mdDatepicker]="picker" placeholder="Choose a date" [(ngModel)]="value">
<button mdSuffix [mdDatepickerToggle]="picker"></button>
</md-input-container>
<md-datepicker #picker [startAt]="startDate" (selectedChanged)="selectedDate($event)"></md-datepicker>
<p>ngModel Value: {{value}}</p>
<p>Date from selectedDate(): {{checkDate}}</p>
datepicker-overview-example.ts:
import {Component} from '@angular/core';
@Component({
selector: 'datepicker-overview-example',
templateUrl: 'datepicker-overview-example.html'
})
export class DatepickerOverviewExample {
value: Date = new Date();
checkDate: Date;
selectedDate(date){
// ngModel still returns the old value
console.log("ngModel: " + this.value);
// date passes the newly selected value
console.log("Selected Value: " + date);
this.checkDate = date;
}
}
