Reactive Forms Angular - Cannot read property 'group' of undefined

Question

Not similar to https://stackoverflow.com/questions/52235952/cannot-read-property-of-undefined-reactive-forms

StackBlitz - https://stackblitz.com/edit/github-rbjwcd-wtrevw

Having issues with the above demo. I am trying to get the form builder to work with models as per the example. The issue is with the .group property.

contactForm: FormGroup;

  createFormGroupWithBuilderAndModel(formBuilder: FormBuilder) {
    return this.formBuilder.group({
      personalData: formBuilder.group(new PersonalData()),
      requestType: '',
      text: ''
    });
  }

I think the issue might be not initialising the form on the return like:

this.contactForm = this.formBuilder.group

Can anybody get this to run?

In constructor ```this.contactForm = this.createFormGroupWithBuilderAndModel(this.formBuilder);``` — Fateme Fazli, Oct 08 '19 at 13:17
Any reason you're passing formBuilder into `createFormGroupWithBuilderAndModel` rather than using `this.formBuilder` directly? (I assume it's me missing something) — Andrew Allen, Oct 08 '19 at 13:22

score 3 · Accepted Answer · answered Oct 08 '19 at 13:20

3

Fixing your stackblitz...

 constructor(private formBuilder: FormBuilder) {
    this.contactForm = this.createFormGroupWithBuilderAndModel(formBuilder);
  }

answered Oct 08 '19 at 13:20

zerocewl

11,401
6
27
53

Np, glad to help you. Maybe check https://stackoverflow.com/help/someone-answers ;-) – zerocewl Oct 08 '19 at 13:41

Reactive Forms Angular - Cannot read property 'group' of undefined

1 Answers1