TimePicker 时间选择框

输入或选择时间的控件。

何时使用

当用户需要输入一个时间,可以点击标准输入框,弹出时间面板进行选择。

代码演示

最简单的用法。

三种大小的输入框,大的用在表单中,中的为默认。

禁用时间选择。

通过 nzHideDisabledOptions 将不可选的选项隐藏。

nzValue 和 nzValueChange 需要配合使用。

不展示秒,也不允许选择。

限制选择 20:3023:30 这个时间段。

API

参数 说明 类型 默认值
ngModel 默认时间 string or Date
nzSize 设置TimePicker大小 'large'|'small'|'default' 'default'
nzPlaceHolder 没有值的时候显示的内容 String "请选择时间"
nzFormat 展示的时间格式 String "HH:mm:ss"、"HH:mm"、"mm:ss"
nzDisabled 禁用全部操作 Boolean false
nzDisabledHours 禁止选择部分小时选项 function()
nzDisabledMinutes 禁止选择部分分钟选项 function(selectedHour)
nzDisabledSeconds 禁止选择部分秒选项 function(selectedHour, selectedMinute)
nzHideDisabledOptions 添加该属性来隐藏禁止选择的选项 attribute -