Can not read property 'controls' of angular undefined

0

I'm trying to follow the following tutorial on angular io to add to my form fields dynamically:

AngularIO Tutorial

However, I'm getting:

  

Can not read property 'controls' of undefined

My code:

import { FormBuilder, FormArray } from '../../../../../node_modules/@angular/forms';

Module:

import { ReactiveFormsModule } from '@angular/forms';



produtoForm = this.fb.group({
    nomeproduto: [''],
    valorcompra: [''],
    valorvenda: [''],
    skuprincipal: [''],
    indicepersonalizado: [''],
    ean: [''],
    gtin: [''],
    marca: [''],
    estoque: [''],
    prazoproducao: [''],
    altura: [''],
    largura: [''],
    comprimento: [''],
    peso: [''],
    linkfoto1: [''],
    linkfoto2: [''],
    linkfoto3: [''],
    linkfoto4: [''],
    linkfoto5: [''],
    linkfoto6: [''],
    video: [''],
    variacoes: this.fb.array([
      this.fb.control('')
    ])
  });

Declaration of variables:

produtoForm = this.fb.group({
    nomeproduto: [''],
    valorcompra: [''],
    valorvenda: [''],
    skuprincipal: [''],
    indicepersonalizado: [''],
    ean: [''],
    gtin: [''],
    marca: [''],
    estoque: [''],
    prazoproducao: [''],
    altura: [''],
    largura: [''],
    comprimento: [''],
    peso: [''],
    linkfoto1: [''],
    linkfoto2: [''],
    linkfoto3: [''],
    linkfoto4: [''],
    linkfoto5: [''],
    linkfoto6: [''],
    video: [''],
    variacoes: this.fb.array([
      this.fb.control('')
    ])
  });

Template area giving the error:

<div formArrayName="variacoes">
        <div *ngFor="let variacao of produtoForm.variacoes.controls; let i=index">
              <label>
                Nome Variação:
                <input type="text" [formControlName]="i">
              </label>
                </div>
</div>

I've also tried:

<div *ngFor="let variacao of variacoes.controls;
    
asked by anonymous 19.09.2018 / 14:20

0 answers