Validation of input fields in a reactive form (formArray)

Ionic Framework ionic-v3
1

Hello,
I work with reactive forms so I can dynamically generate forms at a click of a button. The entered values are stored in a formArray. Unfortunately, I can not validate the input (as I did with the template-driven forms).

Does anyone have an example or an idea how to perform the validation?

I try this:

<form [formGroup]="myForm" (ngSubmit)="submit(myForm.value)">
  <div formArrayName="alternativen">
    <div id="div-alternative" *ngFor="let step of myForm.controls.alternativen.controls; let i = index;">
    <div [formGroupName]="i" id="div-investitionFormBody">


    <table>
      <tr>
        <td class="item-fields-column">
          <ion-label class="label-kostentraeger">Costs</ion-label>
          <ion-item>
            <ion-input type="number" formControlName="costs" [min]="0" step="0.01" placeholder=0></ion-input>
          </ion-item>
          .....
       </td>
     </tr>
     
     <p class="error-inputNumber" *ngIf="!myForm.controls['costs'].errors && myForm.controls['costs']..dirty">Invalid input</p>
.....

This is the runtime error:

undefined is not an object (evaluating ‘_v.context.index.controls[‘costs’]’)

2

myForm.get(‘alternative’).controls[i].get(‘costs’).hasError(‘pattern’)
!myForm.get(‘alternative’).controls[i].get(‘costs’).valid
myForm.get(‘alternative’).controls[i].get(‘costs’).dirty