Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

1.1K
Vistas
Cómo obtener controles de grupos de formularios anidados en angular

https://angular.io/api/forms/FormGroup#controls

Siguiendo mi formulario:

 this.form= this.fb.group({ id: ['', [Validators.required]], name: ['', [Validators.maxLength(500)]], child: this.fb.group({ id: [ '', [Validators.required]], name: [''] }) });

Quiero obtener la validez de child, como this.form.controls.child.controls.valid , mientras que .controls renturn AbstractControl se refiere a esta API de formgroup.

error de compilación angular, error TS2339: la propiedad 'controles' no existe en el tipo 'AbstractControl'.

over 4 years ago · Santiago Trujillo
3 Respuestas
Responde la pregunta

0

Estás cerca. Vea el ejemplo de código a continuación o juegue con él en el muy simple (y feo) StackBlitz que creé.

Demostración de StackBlitz

En su plantilla, asegúrese de agregar su grupo de formulario secundario.

 <div> <form [formGroup]="myForm" (ngSubmit)="send()"> <input type="text" name="name" formControlName="name"> <div formGroupName="child"> <input type="text" name="id" formControlName="id"> <input type="text" name="name" formControlName="name"> </div> <button class="btn btn-primary">send</button> </form> </div>

Luego, en su componente, puede acceder a los campos así.

this.myForm['controls'].child['controls'].id.valid

La forma reactiva que creé para este ejemplo:

 this.myForm = this.fb.group({ name: ['', [Validators.maxLength(500)]], child: this.fb.group({ id: ['', [Validators.required]], name: [''] }) });

**Actualización de diciembre de 2019**

Mi respuesta original es un poco anticuada. ¡Ahora hay una manera mucho más limpia de lograr esto! A continuación se muestra el código de ejemplo de la solución más limpia.

this.myForm.get('child.id').valid

over 4 years ago · Santiago Trujillo Denunciar

0

Hay un par de formas muy sencillas de acceder a FormControl en un FormGroup anidado. De las notas de uso de AbstractControl:

Recuperar un control anidado

Por ejemplo, para obtener un control de nombre anidado dentro de un subgrupo de personas:

this.form.get('persona.nombre');

-O-

this.form.get(['persona', 'nombre']);

over 4 years ago · Santiago Trujillo Denunciar

0

userForm=new FormGroup({ fName:new FormControl('',Validators.required), lName:new FormControl(), eMail:new FormControl('',[Validators.email,Validators.required]), qualificationForm:new FormGroup({ perS:new FormControl(''), perHs:new FormControl('') }) }); save(){ console.log(this.userForm.get("qualificationForm.perS").value); }
over 4 years ago · Santiago Trujillo Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda