Campos de data e hora são digitados em segmentos: dia, mês e ano na ordem da localidade, depois horas e minutos no relógio de 12 ou 24 horas dela. Cada segmento é um spinbutton: digite os dígitos e ele avança sozinho, ou mude o valor passo a passo com as setas. Cole uma data inteira e todos os segmentos são preenchidos.

Os seletores adicionam um calendário em um popover, para uma data ou um intervalo com presets. Os valores são strings ISO simples, como 2026-09-25 ou 2026-09-25T09:30, e todo campo funciona com Signal Forms, formulários reativos e ngModel.

Neste site, os exemplos seguem o idioma da página: troque o idioma para ver a ordem, os separadores e os dígitos mudarem.

Campos de data e hora

Digite os dígitos, ou use as setas. Um segundo Backspace volta um segmento. minuteStep define quanto as setas movem os minutos.

ddmmaaaa
0730

Birthday: not set · Alarm: 07:30

Seletores de data

O botão abre um calendário no dia escolhido, e a escolha o fecha. Com granularity="minute", o seletor também recebe uma hora, e o calendário muda só a data.

ddmmaaaa
260920260930

Departure: not set · Meeting: 2026-09-26T09:30

Um intervalo de datas

Dois campos e um calendário de dois meses. nuiDateRangePresets() adiciona intervalos comuns; o valor continua null até que as duas pontas sejam definidas, em ordem.

ddmmaaaaddmmaaaa

Type both dates, pick them in the calendar, or choose a preset.