He usado la entrada HTML con el campo de fecha en la aplicación Angular. Me gustaría abrir el modal del campo de fecha en la carga de la página según una condición sin usar jquery. La condición es cuando la entrada tiene una fecha seleccionada, entonces el calendario no debe abrirse y si no hay una fecha seleccionada, entonces se debe abrir el menú desplegable.
Intenté configurar onLoad en la etiqueta HTML, pero no estoy seguro de cómo cerrar/abrir el modal del calendario.
<input [class.is-invalid]="deliveryDate.invalid && deliveryDate.touched" type="date" class="form-control" [ngClass]="{'alerts-border': isDateSelected()}" [min]="cartItems.minDeliveryDate" formControlName="delivery_date" onkeydown="return false" />Como se describe en esta respuesta , el elemento selector de fecha es una especie de ventana separada y parece que no puede llamarlo directamente.
Entonces la respuesta es: no, no puede abrir el selector de fechas. Si tiene material angular instalado, puede probar su datepciekr.
No sé si esto es exactamente lo que quieres, pero puedes probar esto:
<input [class.is-invalid]="deliveryDate.invalid && deliveryDate.touched" type="date" class="form-control" [ngClass]="{'alerts-border': isDateSelected()}" [min]="cartItems.minDeliveryDate" formControlName="delivery_date" [disabled]="form.value.delivery_date != null ? true : false" onkeydown="return false" />NOTA : No dijiste el nombre de tu formulario, puse form como nombre ([disabled]=" form .value...). Si tu formulario tiene otro nombre, cambia " form " por él.
Cuando inicialice el campo fecha_entrega , debe inicializarlo en nulo si desea que los usuarios puedan elegir una fecha (o con una cadena como "2021-11-23" si desea mostrar la fecha pero no permitir que el usuario elija otra) .
EXTRA : cuando tenga la "idea", si es lo que quería, debe saber que incluso puede manejar la discapacidad de la entrada con formControlName="delivery_date" programáticamente (en su código .ts ), así:
// To disable this.form.get('delivery_dat').disable(); // to enable this.form.get('delivery_dat').enable(); // so you can do things like: if (this.form.get('delivery_dat') != null) { this.form.get('delivery_dat').disable(); } else { this.form.get('delivery_dat').enable(); }