ng2-datepicker

Angular 2+ Simple and minimal datepicker component

Installation

1. Install package from npm.

npm install ng2-datepicker --save

2. Include NgDatepickerModule into your application.

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { NgDatepickerModule } from 'ng2-datepicker';

@NgModule({
  imports: [
    BrowserModule,
    NgDatepickerModule
  ],
  declarations: [ AppComponent ],
  exports: [ AppComponent ]
})
export class AppModule {}

Example

  <ng-datepicker [(ngModel)]="date" />

Additional attributes

|Name|Type|Default|Description| | --- | --- | --- | --- | |headless|boolean|false|Disable datepicker's input| |isOpened|boolean|false|Show or hide datepicker| |position|string|bottom-right|Dropdown position (bottom-left, bottom-right, top-left, top-right)|

Options

import { DatepickerOptions } from 'ng2-datepicker';
import * as frLocale from 'date-fns/locale/fr';

options: DatepickerOptions = {
  minYear: 1970,
  maxYear: 2030,
  displayFormat: 'MMM D[,] YYYY',
  barTitleFormat: 'MMMM YYYY',
  firstCalendarDay: 0, // 0 - Sunday, 1 - Monday
  locale: frLocale
};

For available format options check out here.

Run Included Demo

1. Clone this repository

git clone https://github.com/jkuri/ng2-datepicker.git
cd ng2-datepicker

2. Install packages

npm install

3. Run Demo

npm start

Licence

MIT