NiraDatePicker

This library Supports Angular CLI versions greater than or equal to 16.1.0.

nira-date-picker is a date picker with some abilities like customizing theme , setting default date, ...

nira-date-picker is a date picker based on Shamsi date and Jalali Moment package is used in it.

coming soon

the Gregorian section in nira-date-picker will be activate.

Installation

npm i nira-date-picker

How To open calendar

1. First inject NiraDatePickerModule in the module you want to use nira-date-picker like bellow:

import { NiraDatePickerModule } from 'nira-date-picker';
@NgModule({
//other inputs
  imports: [
    NiraDatePickerModule,
   ]})

2. You should bind nira-date-picker with an HTML input tag by isOpenCalendar ;a two way bind property; the calendar will be opened by click on the input and change isOpenCalendar value to true . like bellow(in component.html file):

<input (click)="_isOpenCalendar = true" />
<lib-nira-date-picker
  [(isOpenCalendar)]="_isOpenCalendar">
</lib-nira-date-picker>

How To Get Selected Date From nira-date-picker

you must get selected date from datePickerResult property like bellow (in component.html file):

<input (click)="_isOpenCalendar = true" [value]="date" />
<lib-nira-date-picker
  [(isOpenCalendar)]="_isOpenCalendar" 
  (datePickerResult)="date = $event"> 
</lib-nira-date-picker>

How set default value to nira-date-picker

you must set default value by defaultDate property in nira-date-picker like bellow (in .component.html file):

<input matInput id="datePickerInput " [value]="date" />
<lib-nira-date-picker
  (click)="_isOpenCalendar = true" 
  [defaultDate]="date"
  [(isOpenCalendar)]="_isOpenCalendar"
  (datePickerResult)="date = $event">
</lib-nira-date-picker>

How Set Current Date To input If There Is Not Default Date

you might set selectToday property to true and get current date from todayDate like bellow:

<lib-nira-date-picker
 [selectToday]="true"
 (todayDate)="getToday($event)" 
 [(isOpenCalendar)]="isOpen" 
 [defaultDate]="getDefaultDate()"
 (datePickerResult)="date = $event">
</lib-nira-date-picker>