How to use date picker in Angular 2?

Question

I have tried many date picker in my angular2 app but none of them is working.Although the date picker is displaying on the view but the value of selected date is not getting

Answer 1

As answered by @thierry yes there is option for us to use

<input type="date" [(ngModel)]="company.birthdate"/>

for getting date for our project. but yes this is not compatible for the multi browser plateform (like mozila) and there are many cross browser library for the same.

I have made two stylish calendar Datepickers using Bootflat theme which is responsive too refer here

https://github.com/MrPardeep/Angular2-DatePicker

hope this gives you more stylish and multi browser datepicker.

Answer 2

See ng2-boostrap datePicker seems to overwrite ngModel, while the question is different, the answers given to it solved the issue you described for me.

Assuming using typescript, you need to add this to the html markup:

<datepicker [(ngModel)]="dateValue" [showWeeks]="false"</datepicker>

and in the component ts file, you will need to import

import {DATEPICKER_DIRECTIVES} from 'ng2-bootstrap/ng2-bootstrap';

and add the DATEPICKER_DIRECTIVES to your providers list.

Answer 3

PrimeNG also provides a DatePicker component, live demo;

http://www.primefaces.org/primeng/#/calendar