Ionic Framework -时间选择器-启用无限滚动

kkbh8khc  于 2023-09-28  发布在  Ionic
关注(0)|答案(2)|浏览(144)

我希望时间选择器(https://ionicframework.com/docs/api/datetime)无限旋转。
如果我选择小时,我从0开始,到23结束。当我在23时,我必须一路滚动到0。
我想要的是,当我在23时,再向下滚动一个单位,这样它就又从0开始了,这样我理论上就可以无限地向下滚动。

fcy6dtqo

fcy6dtqo1#

我不相信在离子日期时间组件中也有某种方法来做这种事情。你可以做的是绑定一个重复这些值的变量[0-23]并在hourValues属性上设置

8wigbo56

8wigbo562#

你应该使用Timeless Picker包。
安装:
npm i --save timeless-picker
npm i --save-dev @types/hammerjs
将样式添加到index.html:
<link href="https://cdn.jsdelivr.net/npm/timeless-picker/src/styles/styles.css" rel="stylesheet">
将TimelessPickerModule导入到app.module中以使用该包:
然后,您可以使用组件。根据您提供的照片,您应该具有以下属性:

<timeless-time-picker
 [hourFormat]='hours24'
 [startTime]='23:59:00'
 (timeChangeIso)=newTimeEvent()
>
</timeless-time-picker>

如果您不想接收ISO格式的新时间,可以使用(timeChangeSimple)而不是(timeChangeIso)。这将以字符串'HH:mm:ss'的形式返回。
还有许多其他可自定义的属性。请参阅文档:https://github.com/eliasab16/timeless-picker

相关问题