# Datepicker

This library was generated with [Angular CLI](https://github.com/angular/angular-cli) version 7.2.0.

## 使用实例

html

```html
<farris-datepicker
    [(ngModel)]="singleDate"
    [disabled]="opts.disabled"
    [readonly]="opts.readonly"
    [editable]="opts.editable"
    [locale]="opts.locale"
    [dateRange]="opts.dateRange"
    [showTime]="opts.showTime"
    [showType]="opts.showType"
    [dateFormat]="opts.dateFormat"
    [placeholder]="opts.placeholder"
    [maxDate]="opts.maxDate"
    [minDate]="opts.minDate"
    [dateRangeDatesDelimiter]="opts.dateRangeDatesDelimiter"
    [shortcuts]="opts.shortcuts"
></farris-datepicker>
```

## 配置项

### Input

**disabled**

-   default: false
-   type: boolean

是否禁用该组件。

**readonly**

-   Default：`false`
-   type: `boolean`

是否只读。

**editable**

-   Default：`true`
-   type: `boolean`

是否只能选择数据，不可键入。

**dateRange**

-   Default：`false`
-   type: `boolean`

是否使用日期范围输入模式。

**showTime**

-   Default：`false`
-   type: `boolean`

是否使用时间输入框。

**showType**

-   Default：`1`
-   type: `number`
-   options: `'all': 1 | 'noDate': 2 | 'noDateAndMonth': 3 | 'selectWeek': 4`

显示类型，默认显示全部；不显示日期，用于选择年月模式；不显示日期及月份，用于选择年模式；selectWeek 用于周选择。

**locale**

-   default: `zh-cn`
-   type: `string`
-   options: `'en' | 'ja' ...`

本地化。

**dateFormat**

-   Default：`yyyy-mm-dd`
-   type: `string`

日期格式化，zh-cn 模式下默认为 `yyyy-mm-dd` 。

**placeholder**

-   Default：`请选择`
-   type: `string`

为空时显示的占位符。

**maxDate**

-   Default：`{year: 9999,month: 12,day: 31 }`
-   type: `object`

最大日期。

**minDate**

-   Default：`{year: 1840,month: 1,day: 1 }`
-   type: `object`

最小日期。

**disableDateRangesBegin**

-   Default：`{year: 0,month: 0,day: 0}`
-   type: `object`

禁用日期开始时间。

**disableDateRangesEnd**

-   Default：`{year: 0,month: 0,day: 0}`
-   type: `object`

禁用日期结束时间。

**disableDates**

-   Default：`[]`
-   type: `array<object>`

禁用的日期，例如[{year: 2019,month: 1,day: 1 },{year: 2019,month: 1,day: 2 } ]。

**showWeekNumbers**

-   Default：`false`
-   type: `boolean`

是否显示第几周。

**dateRangeDatesDelimiter**

-   Default：`~`
-   type: `string`

日期范围模式下 input 的显示分割符合。

**shortcuts**

-   Default：`[]`
-   type: `array<object>`

配置左侧 sidebar 快捷键。

示例：

```tsx
;[
    {
        text: '今天',
        onClick(setTime) {
            setTime.emit(new Date())
        }
    },
    {
        text: '昨天到今天',
        onClick(setTime) {
            setTime.emit({
                begin: new Date(new Date().getTime() - 3600 * 1000 * 24),
                end: new Date()
            })
        }
    },
    {
        text: '一周前',
        onClick(setTime) {
            setTime.emit(new Date(new Date().getTime() - 3600 * 1000 * 24 * 7))
        }
    }
]
```

## output

**clear**

清空内容时触发。

**valueChanged**

当内容改变触发。

**onBlur**

当 input 失去焦点触发。