Estoy usando el selector de fecha y hora en primeng para mostrar solo el selector de hora

Aquí está el código que he escrito:

<p-calendar [(ngModel)]="classTimingsArray[i].start_time" timeOnly="true"></p-calendar>

Como le di a timeOnly = true, solo obtengo timepicker, que es lo que quiero

Pero el valor dentro de ngModel es la fecha completa junto con la hora (miércoles 17 de enero de 2018 02:00:00 GMT + 0530 (hora estándar de la India))

Solo quiero recuperar el tiempo

¿Cómo debo hacer eso?

1
Harish 17 ene. 2018 a las 15:17

3 respuestas

La mejor respuesta

Puede manejar el evento onSelect en su plantilla:

<p-calendar (onSelect)="onSelect($event)"
  [(ngModel)]="classTimingsArray[i].start_time" timeOnly="true">
</p-calendar>

De su componente:

timeValue: string;

onSelect($event) {
  let hour = new Date($event).getHours();
  let min = new Date($event).getMinutes();
  if(min < 10) { 
     this.timeValue= `${hour}:0${min}`;
  } else {
     this.timeValue= `${hour}:${min}`;
  } 
}

Manifestación: https://stackblitz.com/ edit / prime-ng-calendar-e8lrz1? file = app% 2Fcalendar% 2Fcalendar.component.ts

6
Edward Ramos 26 jun. 2019 a las 01:00

El tipo de datos predeterminado es Fecha, pero puede cambiarlo a cadena y estará bien

<p-calendar [(ngModel)]="classTimingsArray[i].start_time" timeOnly="true" dataType="string"></p-calendar>

3
dansasu11 9 abr. 2019 a las 21:52
<p-calendar [(ngModel)]="classTimingsArray[i].start_time" timeOnly="true" dataType="string"></p-calendar>

dataType = "cadena"

En este momento se obtendrá como una cadena como esta 14:24

1
Akitha_MJ 6 feb. 2020 a las 08:57