Angular 2+日期范围选择器组件

Angular 2+日期范围选择器组件
插件名称 angular-2-daterangepicker
发布时间 2020年5月26日
插件作者 nikhil-001mehta

这是“日期范围选择器”启发式的日期范围选择器组件,适用于Angular 2、4、5及更高版本。无需Bootstrap框架。

安装:

# NPM
$ npm install angular-2-daterangepicker  --save

使用:

如下所示将DaterangepickerModule导入模块

import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { BrowserModule } from '@angular/platform-browser';
import { DaterangepickerModule } from 'angular-2-daterangepicker';
@NgModule({
	imports: [BrowserModule, DaterangepickerModule],
	declarations: [ AppComponent ],
	bootstrap: [AppComponent]
})
export class AppModule {
	
}

选项

目前,可用的选项非常少,但我将继续开发和添加越来越多的选项

选项名称 类型 目的 默认值 可能的值
format string 此daterangepicker将用于与您的代码进行通信的格式 “YYYY-MM-DD” 按照MomentJS标准格式
displayFormat string 将显示给最终用户的格式 Same as format 按照MomentJS标准格式
startDate string 首次渲染此组件时的默认开始日期。该日期的格式应与上述格式选项的值一致 Current Systetm Date 日期字符串与上面的格式选项的值一致
endDate string 首次渲染此组件时的默认结束日期。该日期的格式应与上述格式选项的值一致 Current Systetm Date 日期字符串与上面的格式选项的值一致
minDate string 默认最短日期不包括此日期。最终用户将无法选择该日期之前的所有日期。该日期的格式应与上述格式选项的值一致 null 日期字符串与上面的格式选项的值一致
maxDate string 默认最大日期不包括此日期。最终用户将无法选择此日期之后的所有日期。该日期的格式应与上述格式选项的值一致 null 日期字符串与上面的格式选项的值一致
inactiveBeforeStart boolean 模糊所选开始日期之前的所有日期。因此,最终用户不能将toDate选择为fromDate之前的日期。 false true,false
autoApply boolean 删除“应用”和“取消”按钮,并在用户选择结束日期后立即应用 false true,false
showRanges boolean 预定义范围以显示给最终用户。因此,最终用户可以使用就绪选项,而不必浏览日历。 false true,false
preDefinedRanges Array of object shown as below. 自定义范围(如果要定义自己的范围)。仅当showRanges选项设置为true时,此选项才有用。
noDefaultRangeSelected boolean 此选项将startDate和endDate选项在首次渲染时设置为空白。如果没有将值传递给startDate和endDate,则此日期范围选择器将dafault设置为startDate和endDate为当前系统日期。 false true,false
singleCalendar boolean 仅使用一个日历。因此,您不需要一个月的另一个日期选择器。 false true,false
position string 弹出窗口的位置。默认情况下,它在输入框的左侧打开 ‘left’ ‘left’,’right’,’center’
disabled boolean 是否禁用主输入控件 false true,false
timePicker object 是否显示时间选择器 null
disableBeforeStart boolean 是否禁用右侧日历中所选开始日期之前的日期。此选项仅适用于右日历 false true,false
alwaysOpen boolean 是否始终打开日历。此选项将删除显示范围的主输入框 false true,false

Custom Range