Geek Answers Handbook

Angular 2 Material Print Date Value

I want to use Angular Material Datepicker to get the date on my page. I use this code, but I can’t figure out how to access the selected value correctly.

<md-input-container> <input mdInput [mdDatepicker]="myDatepicker"> <button mdSuffix [mdDatepickerToggle]="myDatepicker"></button> </md-input-container> <md-datepicker #myDatepicker></md-datepicker>

I tried the [value] field in the input, but how can I get the date to send it to my backend? Thank you

+7
angular datepicker angular-material2
source share
3 answers

You can access the datepicker value using ngModel . ngModel must be in the input tag. See Plunker Demo

+9
source share

as indicated in the docs , there are 2 events (dateChange) and (dateInput) that you can use if you want. $event has 3 details, target is MatDatepickerInput , targetElement for its own HTML element and value , which is a Date object.

 <input matInput [matDatepicker]="pickerFrom" placeholder="From" (dateChange)="changeFunc($event)" <<---- you can send $event (dateChange)="dateInput($event.value)" <<---- or just $event.value >
+2
source share

As Nehl said, you can use the binding [(ngModel)] ; I also forgot the "name" attribute:

  <md-form-field> <input mdInput [(ngModel)]="myDateValue" name="myDate" [mdDatepicker]="picker" placeholder="Select a date">
+1
source share

More articles:


All Articles