1

Buen día, necesito la ayuda de algún conocedor para solucionar este problema, ya probé diferentes métodos y no he llegado a la solución, si alguien me ayuda porfavor

Contexto

Yo tengo un calendario que estoy mostrando en un <mat-calendar> y en donde estoy seteando solo los días que traigo de un objeto, esos días son; pongamos un ejemplos, "dias laborales", bueno esos días traen en que horas se atiende. Un ejemplo más claro: En el calendario tengo habilitados los días Lunes, Martes y Miercoles del mes de diciembre y en ese mes durante esos días se trabaja desde las 7:00 AM hasta las 4:00 PM.

Si un "x" usuario quiere agendar hoy 21 de diciembre a las 3:00 PM por obvias razones, las horas anteriores no deben de salir, porque imaginense que quiera agendar hoy 21 y presione las 2:00 PM cuando esa hora ya paso. No tiene sentido ¿cierto?

Nota: Les menciono el calendario para denotar que la hora va ligada al dia. Si hay un día, hay un rango de horas.

Problema

Tengo una funcion que se encarga de evaluar en un estado "true || false" si la hora ya ha pasado en ese dia

 //Desabilitame las horas en el dia de hoy que ya pasaron "toDate"
      let disable = moment(start).toDate() < moment().add(30, "m").toDate();
      console.log('disable', disable);
      if(disable == true){
        this.isDisable = true;
      }

Donde:

Start: es el dia/fecha en el calendario del momento actual

this.isDisable: es un estado que evalua si la hora debe desabilitarse y se pasa en en el componente html

Pero mi problema es que me desabilita todas las horas, incluso la hora que no ha pasado, por ejemplo si los dias habilitados son de las 7:00 AM a las 5:00 PM me desabilita todo el rango de horas

introducir la descripción de la imagen aquí

HTML

<button *ngIf="selectedTime != time" mat-stroked-button (click)="setTime(time)" [disabled]="isDisable">{{time}}
                                                </button>

Porfavor, porfavor ayuda, ya he preguntado varias veces, he investigado, he buscado, pero no lo he logrado ¿qué estoy haciendo mal? ¿Cómo lo puedo hacer?

1 respuesta 1

0

Solo necesitas comparar las dos fechas para saber si debe deshabilitarse o no.

//Ignora esto, es solo para poner dos fechas diferentes. 
let esteMomento = new Date()
let unaHoraMenos = new Date(new Date().setHours(esteMomento.getHours() - 1))

//Una comparación directa te permitirá deshabilitar los campos que quieres. 
if( esteMomento >= unaHoraMenos ) alert("Hora deshabilitada")

Edición

new Date() internamente es un número:

//Ignora esto, es solo para poner dos fechas diferentes. 
let esteMomento = new Date()
let unaHoraMenos = new Date(new Date().setHours(esteMomento.getHours() - 1))

//Una comparación directa te permitirá deshabilitar los campos que quieres. 
console.log("representacion en milisegundos", esteMomento.getTime()+'>='+ unaHoraMenos.getTime())
if( esteMomento >= unaHoraMenos ) alert("Hora deshabilitada")

Date

[...] La fecha se mide en milisegundos desde la media noche exacta del 01 de enero de 1970 en formato UTC. Un día contiene 86.400.000 milisegundos. El rango del objeto Date va desde -100,000,000 días hasta 100,000,000 días respecto del 01 de enero de 1970 UTC.

3
  • Muchas gracias por responderme, ¿Porque el if lo compara con un "=>"? Puedo preguntar ¿seria mal hacer una meet? Es que estoy confundida, y te juro que he intentado de todo, incluso varias preguntas sobre este tema aqui y no me queda claro. Una disculpa la molestia, es solo que quiero hacerlo pero también aprender
    – Izlia
    Commented el 22 dic. 2021 a las 0:10
  • 1
    Error de dedo. El operador => esta reservado para las funciones de flecha. Lo que pasaba es que se estaba retornando un valor true y la validación siempre hiba a ser verdadera. Ya lo corregi. Debia ser >=, que ahora si es el operador de comparación mayor o igual.
    – Legna
    Commented el 22 dic. 2021 a las 0:18
  • 1
    Dicho esto, en el fondo new Date() es un valor expresado en milisegundos, por tanto, comparar dos fechas es comparar dos números. Agrego un ejemplo de esto en la respuesta.
    – Legna
    Commented el 22 dic. 2021 a las 0:19

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.