FormGroup ожидает экземпляр FormGroup

У меня есть пример базовой формы Angular 2 RC4 на Plunkr, который, похоже, выдает следующую ошибку (в консоли Chrome DEV)

Здесь plunkr

https://plnkr.co/edit/GtPDxw?p=preview

Ошибка:

browser_adapter.ts:82 EXCEPTION: Error: Uncaught (in promise): EXCEPTION: Error in ./App class App - inline template:1:7
ORIGINAL EXCEPTION: formGroup expects a FormGroup instance. Please pass one in.
           Example: <form [formGroup]="myFormGroup">

ORIGINAL STACKTRACE:
Error: formGroup expects a FormGroup instance. Please pass one in.
           Example: <form [formGroup]="myFormGroup">

    at new BaseException (https://npmcdn.com/@angular/[email protected]/src/facade/exceptions.js:27:23)
    at FormGroupDirective._checkFormPresent (https://npmcdn.com/@angular/[email protected]/src/directives/reactive_directives/form_group_directive.js:110:19)
    at FormGroupDirective.ngOnChanges (https://npmcdn.com/@angular/[email protected]/src/directives/reactive_directives/form_group_directive.js:39:14)
    at DebugAppView._View_App0.detectChangesInter

Ответы

Ответ 1

В вашем коде есть несколько проблем.

  • <div [formGroup]="form"> вне тега <form>
  • <form [formGroup]="form">, но имя свойства, содержащего FormGroup, равно loginForm, поэтому оно должно быть <form [formGroup]="loginForm">
  • [formControlName]="dob", который передает значение свойства dob, которое не существует. Вам нужно передать строку dob как [formControlName]="'dob'" или проще formControlName="dob"

Пример плунжера

Ответ 2

Я использовал реактивные формы и столкнулся с похожими проблемами. Что помогло мне, так это убедиться, что я настроил соответствующую FormGroup в классе. Что-то вроде этого:

myFormGroup: FormGroup = this.builder.group({
    dob: ['', Validators.required]
});