Primeng使用滑块选择小时

Question

我想以一种可以选择时间段的方式编辑Primeng滑块。

用户打开应用程序时，应将滑块设置为12:00。但是，用户可以从00:00 Tot 23:59。

一路扩展选择。

，但我在文档中找不到有关从滑块更改值的任何内容。它仅设置为1至100。

Answer 1

您可以将0用作MinValue，而2359则可以用作MaxValue。然后基于rangevalues

Answer 2

不相信您可以为滑块使用数字。min和max都是数字

Answer 3

我知道这迟到了几年，但是我一直在寻找做到这一点的方法...

您需要将小数号转换为时间。有许多好的在线计算器可以做到这一点。这也恰好显示了这样做的方程式。只需确保将单位时间设置为几分钟（或更改为您需要使用的内容...）

在午夜至午夜，您需要min=0和max=1440。1440仅为60 * 24（一天分钟）。您可以根据需要进行调整。

但是，这意味着您的滑块仅显示0-1440，这不是您想要的。您需要将数字插入一个打印出格式为时间的字符串的函数。

convertDecimalToTime(decimal: number) {
    let running, hours, minutes;
    running = decimal / 60;
    hours = Math.floor(running);
    running = running - hours;
    minutes = Math.round(running * 60);
    
    return hours + ':' + minutes;
}

您现在应该有一个输出时间的滑块。