Tengo un código de trabajo Pero mecanografiado se queja.

Tengo una matriz de dos formas anidada (educationItem anidada dentro de education). Puedo crear un captador para acceder a los controles de FormArray para el primer bucle. Pero TypeScript no se queja de esta matriz.

get controls(){
return (this.educationForm.get('education') as FormArray).controls
}

La mecanografía se queja de la segunda matriz, que está anidada dentro de la primera. TypeScript no reconoce la variable educationItem como un FormArray.

Las funciones getter no toman argumentos, y no estoy seguro (1) cómo escribirlo en la propia plantilla, o (2) escriba un getter con educationItem como argumento (puede ser un setter)

El fragmento de código está siguiendo

            <div *ngFor="let educationItem of education.controls; index as i">
              <ng-container [formGroupName]="i">
                <ng-container>
                  <ion-button type="button" (click)="addRole(educationItem)">Add Role</ion-button>
                  <div formArrayName="description">
                    <div
                      class="players"
                      *ngFor="let role of educationItem.get('description').controls; let roleIndex = index"
                      [formGroupName]="roleIndex"
                    >
                      <ion-item>
                        <ion-label position="floating">Role title</ion-label>
                        <ion-input formControlName="title"></ion-input>
                      </ion-item>
                    </div>
                  </div>
                </ng-container>


              </ng-container>
            </div>
0
mozpider 14 abr. 2020 a las 18:26

2 respuestas

Utilice la función $ any () que deshabilita la verificación de tipos en plantilla

Pruebe esto:

         <div *ngFor="let educationItem of education.controls; index as i">
              <ng-container [formGroupName]="i">
                <ng-container>
                  <ion-button type="button" (click)="addRole(educationItem)">Add Role</ion-button>
                  <div formArrayName="description">
                    <div
                      class="players"
                      *ngFor="let role of $any(educationItem).get('description').controls; let roleIndex = index"
                      [formGroupName]="roleIndex"
                    >
                      <ion-item>
                        <ion-label position="floating">Role title</ion-label>
                        <ion-input formControlName="title"></ion-input>
                      </ion-item>
                    </div>
                  </div>
                </ng-container>
              </ng-container>
            </div>
0
Chellappan வ 14 abr. 2020 a las 15:54

No puede usar un captador, pero puede usar una función. No puedo imaginar tu json. Si me imagino algunos como:

educationForm={
      education:[
      {
       description:[
         {roleIndex:1,...rest of properties},
         {roleIndex:2,...rest of properties},
        ],
       ...rest of properties
      },
      {
       description:[
          {roleIndex:1,...rest of properties},
          {roleIndex:2,...rest of properties},
        ],
        ...rest of properties
       }
       ],
       ...rest of properties
}


getDescription(index:number){
 const group=(this.educationForm.get('education') as FormArray).at(index)
 return (group.get('description') as FormArray)
}
0
Eliseo 14 abr. 2020 a las 15:56