1

Tengo el siguiente problema, espero que puedan ayudarme:

Tengo un formulario en mi plantilla HTML:

    <form #formulario="ngForm" autocomplete="off">
        <div>
            <label for="periodo">Periodo</label>
            <select id="periodo" #periodo ngModel required name="periodo">
                <option *ngFor="let periodo of periodos" [value]="periodo.id">{{periodo.fecha_inicio}}</option>
            </select>
        </div>
    </form>

Y me gustaria saber como puedo definir una opcion por defecto en mi select. Ya eh intentado agregando el atributo [selected]="defaultValue" pero no consiguo el resultado esperado.

Cualquier sugerencia es bienvenida...

SOLUCION

Ok, pude solucionarlo. Dejare mi respuesta por si le sirve a alguien:

Definí en mi archivo .ts una variable con el valor que espero establecer por defecto:

defaultValue = val;

y en mi plantilla HTML

 <form #formulario="ngForm" autocomplete="off">
        <div>
            <label for="periodo">Periodo</label>
            <select id="periodo" #periodo ngModel required name="periodo">
                <option *ngFor="let periodo of periodos" [value]="periodo.id" [selected]="default == paralelo.descripcion">{{periodo.fecha_inicio}}</option>
            </select>
        </div>
    </form>
1

1 respuesta 1

1

Puedes hacerlo creando un "index" y luego vincularlo a la opcion [selected].

También, nota el cambio que hice en el ngFor, ya que no habías cerrado las comillas.

<option *ngFor="let periodo of periodos; let index = index" [value]="periodo.id" [selected]="index == 1" >{{periodo.fecha_inicio}}</option>

Espero te sirva.

2
  • Tambien habia explorado esta opción, sin embargo, el escenario de mi problema requería que se asigne un valor dinamico por defecto. Estoy seguro de que tu respuesta ayudara a muchos. Gracias Hugo. el 27 jul. 2018 a las 0:15
  • 1
    La otra opción sería asignarle un [(ngModule)]="mi_variable" al <select> (no al <option>) y luego en el onInit() asignas el valor el 27 jul. 2018 a las 0:32

Tu Respuesta

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

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