Property ... does not exist on type '{ [key: string]: AbstractControl; }'

I am having a form defined as the code below. ionic serve does fine, However when I compile my app using ionic run android I got the error:

Property 'email' does not exist on type '{ [key: string]: AbstractControl; }'.    

Any thoughts on what I do wrong?

constructor(

    fb: FormBuilder) {

    // this.recoverPasswordForm = fb.group({
    //     'email': [navParams.get('username') || '', Validators.compose([Validators.required, ValidatorService.email])]
    // });

    this.recoverPasswordForm = new FormGroup({
        email: new FormControl([navParams.get('username') || '', Validators.compose([Validators.required, ValidatorService.email])),
    });

}


recoverPassword() {

    this.account.recoverPassword(this.recoverPasswordForm.get('email').value).subscribe(res => {

I have also same issue

Error at H:/IO2RC0/MyApp/.tmp/pages/forgot/forgot.ngfactory.ts:735:58: Property 'email' does not exist on type '{ [key: string]: AbstractControl; }'.

1 Like

I’ve tried various ways to create my form like:

method 1

   this.recoverPasswordForm = new FormGroup({
        email: new FormControl('me@me.com', Validators.minLength(2)),
    });

method 2

    let control = fb.control('', Validators.required);

    this.recoverPasswordForm = fb.group({
        'email': control
    });

method 3

    this.recoverPasswordForm = new FormGroup({
        email: new FormControl('me@me.com', Validators.minLength(2)),
    });

All keep giving the same error. Also posted this question on Stackoverflow: http://stackoverflow.com/questions/39881367/property-does-not-exist-on-type-key-string-abstractcontrol

It turned out the problem is caused when this.recoverPasswordForm is defined as:

recoverPasswordForm: FormGroup

instead when I use

recoverPasswordForm = null there is no problem

Actually this quite weird since according to the documentation FormGroup returns of the type FormGroup

3 Likes

Same issue comes with me and when i remove FormGroup as a datatype it works fine. Is this issue?

I think it is but I guess it is an Angular problem not an Ionic one

Since I see more people reporting this issue e.g. I read it here as well.

I’ve created an Angular bug report at https://github.com/angular/angular/issues/12181

As replied on my bug report the error was in my form. I was using recoverPasswordForm.controls.email instead of recoverPasswordForm.get('email') in my template.

Also got a nice recommendation to read: https://github.com/qdouble/angular-webpack2-starter#aot--donts

2 Likes