I want to use Angular Material Datepicker to get a date into my page. I use this code, but cannot 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 input but how can I get the date to send it to my backend?
Thanks.
To use Datepicker in our application, we need to import MatDatepickerModule in application module. On this page we will create Datepicker and fetch selected value using NgModel , FormControl and FormGroup .
mat-datepicker exampleAdd a template reference variable mat-datepicker element. Connect mat-datepicker to input element via [matDatepicker] property. Finally add date picker toggle button to display or hide calender popup by using mat-datepicker-toggle element.
A datepicker is composed of a text input and a calendar pop-up, connected via the matDatepicker property on the text input. There is also an optional datepicker toggle button that gives the user an easy way to open the datepicker pop-up.
You can access the datepicker value by using ngModel
. The ngModel
needs to be in the input
tag. See the Plunker demo.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With