ng2-ui-kit
Version:
Angular2 UI Kit
73 lines (54 loc) • 1.8 kB
Markdown
<p align="center">
<img src="https://cloud.githubusercontent.com/assets/1796022/18261971/a8dc6eda-73fd-11e6-8c49-e15c435f6b5f.png">
</p>
<p align="center">
<h3 align="center">Angular UI Dev Kit</h3>
</p>
<p align="center">
<a href="http://ng2-ui-kit.jankuri.com">Demo</a>
</p>
## Quick Start
### 1. Install
**ng2-ui-kit** is available on **npm** package manager.
```
npm install ng2-ui-kit --save
```
### 2. Import
There's only one import that's need to be done since Angular NgModule pattern.
```ts
// app.module.ts
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { AppComponent } from './app.component';
import { UI_KIT } from 'ng2-ui-kit';
@NgModule({
declarations: [
AppComponent,
UI_KIT
],
imports: [
BrowserModule,
CommonModule,
FormsModule
],
entryComponents: [AppComponent],
bootstrap: [AppComponent]
})
export class AppModule { }
```
After that, you'll have **ng2-ui-kit** available app-wide.
## Modules
### Calendar (ui-kit-calendar)
#### Usage
```html
<ui-kit-calendar [(ngModel)]="obj.date"></ui-kit-calendar>
```
#### Input Options
- `[opened]` **boolean** If true, calendar will be init as opened. Default `false`
- `[format]` **moment.js format** If specified, model value will be customly formatted. Default: `'YYYY-MM-DD'`
- `[viewFormat]` **moment.js format** Rendeder value format. Default `'D MMMM YYYY'`
- `[firstWeekdaySunday]` **boolean** If `true`, days will be rendered as first weekday Sunday. Default `false`
## Example Form
