1

I'm busy with the 'Angular - The Complete Guide (2021 Edition)' on Udemy and have run into a bit of an issue:

I keep getting the following error: TS2339: Property 'controls' does not exist on type 'AbstractControl' I'm working with the latest version of Angular.

Here is my HTML code:

                    <div class="row" *ngFor="let ingredient of recipeForm.get('ingredients').controls; let i = index"
                        [formGroupName]="i" style="margin-top: 10px;">
                        <div class="col-xs-8">

Any advise will be much appreciated! Thanks!

PaigeF
  • 31
  • 1
  • 1
  • 3
  • Can you try: `(recipeForm.get('ingredients') as any).controls` ?. You have to provide TS file of your component that can some one help you. – HDJEMAI May 25 '21 at 08:02
  • 1
    See if this helps: https://stackoverflow.com/a/46928219/6513921 – ruth May 25 '21 at 08:07

1 Answers1

1
      <div
        class="row"
        *ngFor="let ingredientCtrl of recipeForm.get('ingredients')['controls']; let i = index"
        [formGroupName]="i"
        style="margin-top: 10px;">

// just use ['Controls'] instead of .Controls

  • really you should use a getter to get the array `get ingredientsArray(){return this.form.get('ingredients') as FormArray}` and use `ingredientsArray.controls` – Eliseo Aug 02 '21 at 09:11