¡Ya intenté seguir el ejemplo de otras respuestas de aquí y no lo conseguí!
He creado un formulario reactivo (es decir, dinámico) y quiero desactivar algunos campos en un momento dado. El código de mi formulario:
this.form = this._fb.group({
name: ['', Validators.required],
options: this._fb.array([])
});
const control = <FormArray>this.form.controls['options'];
control.push(this._fb.group({
value: ['']
}));
mi html:
<div class='row' formArrayName="options">
<div *ngFor="let opt of form.controls.options.controls; let i=index">
<div [formGroupName]="i">
<select formArrayName="value">
<option></option>
<option>{{ opt.controls.value }}</option>
</select>
</div>
</div>
</div>
He reducido el código para facilitar. Quiero desactivar el campo de tipo select. He intentado hacer lo siguiente:
form = new FormGroup({
first: new FormControl({value: '', disabled: true}, Validators.required),
});
¡no funciona! ¿Alguien tiene una sugerencia?
Presta atención
Si estás creando un formulario usando una variable para la condición y tratas de cambiarla después no funcionará, es decir, el formulario no cambiará.
Por ejemplo
this.isDisabled = true;
this.cardForm = this.fb.group({
'number': [{value: null, disabled: this.isDisabled},
});
y si se cambia la variable
this.isDisabled = false;
el formulario no cambiará. Debe utilizar
this.cardForm.get('number').disable();
BTW.
Deberías usar el método patchValue para cambiar el valor:
this.cardForm.patchValue({
'number': '1703'
});