| 日期选择框(DatePicker) | 您所在的位置：网站首页 › wps滚动日期选择器 › 日期选择框(DatePicker) |
|
API# 注意： nz-date-picker 的部分 locale 来自于 Angular 自身的国际化支持 ，需要在 app.module.ts 文件中 引入相应的 Angular 语言包。 例如： import {registerLocaleData} from '@angular/common'; import zh from '@angular/common/locales/zh'; registerLocaleData(zh);注意： 所有输入输出日期对象均为 Date ，你可以通过 date-fns 工具库获得你需要的数据。 共同的 API#以下 API 为 nz-date-picker、nz-range-picker 共享的 API。 参数说明类型默认值全局配置[nzId]组件内部 input 的 id 值string-[nzAllowClear]是否显示清除按钮booleantrue-[nzAutoFocus]自动获取焦点booleanfalse-[nzBackdrop]浮层是否应带有背景板booleanfalse[nzDefaultPickerValue]默认面板日期DateDate[]-[nzDisabled]禁用booleanfalse-[nzDisabledDate]不可选择的日期(current: Date) => boolean--[nzDropdownClassName]额外的弹出日历 classNamestring--[nzFormat]展示的日期格式，见nzFormat特别说明string-[nzInputReadOnly]为 input 标签设置只读属性（避免在移动设备上触发小键盘）booleanfalse-[nzLocale]国际化配置object默认配置-[nzMode]选择模式'date' | 'week' | 'month' | 'quarter' | 'year''date'[nzPlaceHolder]输入框提示文字string | string[]--[nzPopupStyle]额外的弹出日历样式object{}-[nzRenderExtraFooter]在面板中添加额外的页脚TemplateRef | string | (() => TemplateRef | string)-[nzSize]输入框大小，large 高度为 40px，small 为 24px，默认是 32px'large' | 'small'--[nzStatus]设置校验状态'error' | 'warning'-[nzPlacement]选择框弹出的位置'bottomLeft' | 'bottomRight' | 'topLeft' | 'topRight''bottomLeft'[nzSuffixIcon]自定义的后缀图标stringTemplateRef-[nzBorderless]移除边框booleanfalse-[nzInline]内联模式booleanfalse-(nzOnOpenChange)弹出日历和关闭日历的回调EventEmitter--共同的方法#名称描述open()打开日历弹层close()关闭日历弹层nz-date-picker#参数说明类型默认值[(ngModel)]日期Date-nz-date-picker[nzMode="date"]#参数说明类型默认值[nzDateRender]自定义日期单元格的内容（month-picker/year-picker 不支持）TemplateRef | string | ((d: Date) => TemplateRef | string)-[nzDisabledTime]不可选择的时间(current: Date) => { nzDisabledHours, nzDisabledMinutes, nzDisabledSeconds }-[nzShowTime]增加时间选择功能object | booleanTimePicker Options[nzShowToday]是否展示“今天”按钮booleantrue[nzShowNow]当设定了nzShowTime的时候，面板是否显示“此刻”按钮booleantrue[nzShowWeekNumber]是否在每一行显示周数（仅日期选择器支持。周选择器始终显示周数）booleanfalse(nzOnOk)点击确定按钮的回调EventEmitter-nz-range-picker#参数说明类型默认值[(ngModel)]日期Date[]-[nzRanges]预设时间范围快捷选择{ [ key: string ]: Date[] } | { [ key: string ]: () => Date[] }-[nzSeparator]分隔符string | TemplateRef'~'(nzOnCalendarChange)待选日期发生变化的回调EventEmitter-nz-range-picker[nzMode="date"]#参数说明类型默认值[nzShowTime]增加时间选择功能object | booleanTimePicker Options[nzDisabledTime]不可选择的时间(current: Date, partial: 'start' | 'end') => { nzDisabledHours, nzDisabledMinutes, nzDisabledSeconds }-[nzShowWeekNumber]是否在每一行显示周数（仅日期选择器支持。周选择器始终显示周数）booleanfalse(nzOnOk)点击确定按钮的回调EventEmitter-nzShowTime 中当前支持的 nz-time-picker 参数有：nzFormat, nzHourStep, nzMinuteStep, nzSecondStep, nzDisabledHours, nzDisabledMinutes, nzDisabledSeconds, nzHideDisabledOptions, nzDefaultOpenValue, nzAddOn FAQ#为何在设置 nzFormat="dd/MM/yyyy" 后手动输入不生效#需要引入 date-fns 。日期格式化目前同时支持两种方式：DatePipe（默认，语法参考） 和 date-fns（见如何使用 date-fns 进行日期格式化）。当你引入 date-fns 后，NG-ZORRO 会使用它提供的 API 来进行反序列化。 |
| CopyRight 2018-2019 实验室设备网 版权所有 |