Package Exports

@ngx-tiny/date-picker

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@ngx-tiny/date-picker) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@ngx-tiny/date-picker

Date Picker Inline

Angular Date Picker.

Angular 10 implementation
Works with SSR
Works alone or with angular forms
Only Depends on date-fns for localization
Single Or Range Selection
Themeable to own requirements

Installation

$ npm i @ngx-tiny/date-picker

Documentation

Full Docs:

You can find the full documentation at https://aavanzyl.github.io/ngx-tiny which includes

Installation instructions
Usage and Demos
Styling Reference
API Reference

Quick Start:

Install with npm: npm install @ngx-tiny/date-picker --save

Add NgxDatePickerModule to your @NgModule like example below

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { NgxDatePickerModule } from '@ngx-tiny/date-picker';

import { AppComponent } from './app.component';

@NgModule({
    imports: [BrowserModule, NgxDatePickerModule],
    declarations: [AppComponent],
    bootstrap: [AppComponent]
})

export class AppModule { }

Add the component to your view for basic

<div class="form-group">
    <label>Single Date</label>
    <input class="form-control" placeholder="Select Date" 
        [ngxDatePicker]="dateInstanceSingle" 
        [value]="singleDate"
        (valueChange)="onChangeSingle($event)">
    <ngx-date-picker #dateInstanceSingle [options]="singleDatePickerOptions"></ngx-date-picker>
</div>

or for Angular forms

<form [formGroup]="myFormSingle" (ngSubmit)="onSubmitSingle()">
    <div class="form-group">
        <label>Single Date</label>
        <input class="form-control" placeholder="Select Date" 
            formControlName="singleDate"
            [ngxDatePicker]="dateInstanceOne" >
        <ngx-date-picker #dateInstanceOne [options]="singleDatePickerOptions"></ngx-date-picker>
        <button class="btn" type="submit">Submit</button>
    </div>
</form>

The examples above are quite basic. The picker has much more features and configurations.

JSPM