angular - inside - formcontrolname must be used with a parent formgroup directive
formGroup espera una instancia de FormGroup (2)
Tengo un ejemplo de formulario básico de Angular 2 RC4 en Plunkr que parece arrojar el siguiente error (en la consola de Chrome DEV)
Aquí está el plunkr
https://plnkr.co/edit/GtPDxw?p=preview
Error:
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
Estaba usando formas reactivas y encontré problemas similares. Lo que me ayudó fue asegurarme de configurar un FormGroup
correspondiente en la clase. Algo como esto:
myFormGroup: FormGroup = this.builder.group({
dob: ['''', Validators.required]
});
Hay algunos problemas en su código
-
<div [formGroup]="form">
fuera de una etiqueta<form>
-
<form [formGroup]="form">
pero el nombre de la propiedad que contieneFormGroup
esloginForm
por lo tanto, debe ser<form [formGroup]="loginForm">
-
[formControlName]="dob"
que pasa el valor de la propiedaddob
que no existe. Lo que necesitas es pasar la cadenadob
como[formControlName]="''dob''"
oformControlName="dob"
másformControlName="dob"