Monthpicker
This package is built on top of Javascript Angular 5/6 Framework.
Description
Monthpicker is developed to select particular month in any angular based application. It is responsive, which works from desktops, laptops, tablets and mobile device as well.
How to Use
Steps to install Monthpicker Library in the application
-
Install with
npm install marsh-monthpicker -
Add MonthpickerModule in app.module.ts
import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { MonthpickerModule } from 'marsh-monthpicker';
@NgModule({
imports: [
BrowserModule,
MonthpickerModule
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }- Add HTML Tags in app.component.html
<input [monthTrigger] ="monthId">
<app-months #monthId [monthOptions] ="alloptions"></app-months>- In component.ts pass parameters
this.alloptions = {
textFormat : "MMM",
selectedMonthBgColor : "#000000",
selectedMonthTextColor : "#ffffff",
transition : "fadeIn",
position : "bottom"
}5.Properties
| Name | Type | Default Value | Required | Options |
|---|---|---|---|---|
| textFormat | string | MMM | Yes | MMM(Eg. Jan), MMMM(Eg. January) |
| selectedMonthBgColor | string | #000000 | Yes | Any color code (Eg. #EEEEEE) |
| SelectedMonthTextColor | string | #ffffff | Yes | Any color code (Eg. #666666) |
| transition | string | none | No | bounce, fadeIn, scale |
| position | string | bottom | No | top, bottom |
Demo
This is Demo