Buen día.
Quizá mi pregunta suena tonta pero no encuentro como asignar un valor por defecto a un <select>
usando formularios reactivos con Angular, es decir, puedo asignar un valor con .setValue
pero no se como hacer que se muestre como la opción seleccionada por defecto cuando se detecta un cambio.
Añade un comentario
|
1 respuesta
Te agrego un ejemplo de como lo hago. Primero hay que agregar la opcion vacía y la funcion change en el select.
<select class='form-control' formControlName="section"
(change)="onSectionChange($event.target.value)">
<option value="">Selecciona la sección.</option>
<option *ngFor="let section of sections" [value]="section.idSeccion">
{{section.nombre}}</option>
</select>
Como ocupo un formulario reactivo, agrego el control para el select. en este caso como se inicializa con valor vacío, se selecciona por default la opción que tiene value=""
.
this.myForm = new FormGroup({
section: new FormControl('', Validators.required)
});
ahora hay que agregar la funcion change aquí haria todo lo que necesitas cuando cambia de valor.
onSectionChange(value) {
//TO DO ...
}
si el cambio que detectas viene de otro control, hay que setear el valor al select usa el setValue.
this.myForm.get('section').setValue(this.sections[2].idSeccion);