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

1. Install with npm install marsh-monthpicker

2. 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 { }

3. Add HTML Tags in app.component.html

    <input [monthTrigger] ="monthId">
    <app-months #monthId [monthOptions] ="alloptions"></app-months>

4. 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