Angular 2+ wrapper for flatpickr
npm install ng2-flatpickr
javascript
npm install --save flatpickr ng2-flatpickr
yarn add flatpickr ng2-flatpickr
`
How to use:
Import the Ng2FlatpickrModule to your NgModule:
`javascript
import { Ng2FlatpickrModule } from 'ng2-flatpickr';
@NgModule({
imports: [
Ng2FlatpickrModule
...
`
Example usage in a form component html template:
`javascript
`
Overwrite the default flatpickr properties by inputting any of the flatpickr options: https://chmln.github.io/flatpickr/options/
`javascript
import { FlatpickrOptions } from 'ng2-flatpickr';
let exampleOptions: FlatpickrOptions = {
defaultDate: '2017-03-15'
};
`
Add locale to the options
`javascript
import { FlatpickrOptions } from 'ng2-flatpickr';
import Russian from 'flatpickr/dist/l10n/ru.js';
let exampleOptions: FlatpickrOptions = {
locale: Russian.ru,
...
};
`
Set a placeholder for the input:
`javascript
`
Set a date using a string or a date object:
`javascript
let randomDateString = '1988-09-19';
let randomDateObject = new Date( 1234567891011 );
`
Flatpickr css needs to be loaded separately. when using @angular/cli, load it in angular.json.
`javascript
"styles": [
"node_modules/flatpickr/dist/flatpickr.min.css"
]
``