Angular desde cero (2024) | 3.5 - Validaciones de datos en formularios reactivos (Parte 1)

Andrés Saavedra@andressaavedra

Angular no me permite acceder a los controles de segundo nivel, si todos los campos se encuentran en un solo formGroup, por ejemplo:

formGroup: FormGroup = this.formBuilder.group({ 
beneficiaryInfo: this.formBuilder.group({ 
beneficiaryName:['',Validators.required],
accountNumber:['',Validators.required],
}),
amount:['', Validators.required]});

Metodo de acceso:

get  beneficiaryNameField(){
return this.formGroup.controls['beneficiaryInfo'].controls['beneficiaryName']
}

Pero si dejas dividido el formGroup en dos, entonces si te lo permitira:

beneficiaryInfoFormGroup: FormGroup =
this.formBuilder.group({
beneficiaryName:['',  Validators.required],
accountNumber:['',  Validators.required],
})

formGroup: FormGroup = this.formBuilder.group({
beneficiaryInfo: this.beneficiaryInfoFormGroup,
amount:['',  Validators.required]
});

Metodo de acceso:

get beneficiaryNameField(){
return this.beneficiaryInfoFormGroup.controls['beneficiaryName']
}

Escribe una respuesta