<!-- IF YOU DON'T FILL OUT THE FOLLOWING INFORMATION WE MIGHT CLOSE YOUR ISSUE WITHOUT INVESTIGATING -->
I'm submitting a ... (check one with "x")
[X] bug report [ ] feature request [ ] support request
Current behavior <!-- Describe how the bug manifests. --> With the latest stable version of Angular2, the forms module loaded, an error is thrown when attempting to use ngModel. What's odd here is ngForm is found and works fine. It's not until I attempt to use ngModel as a variable does this error get thrown.
zone.js:355 Unhandled Promise rejection: Template parse errors: There is no directive with "exportAs" set to "ngModel" (" placeholder="Name" [(ngModel)="model.name" [ERROR ->]#name="ngModel" required /> "): AppComponent@9:16 ; Zone: <root> ; Task: Promise.then ; Value: Error: Template parse errors:(…) Error: Template parse errors: There is no directive with "exportAs" set to "ngModel" (" placeholder="Name" [(ngModel)="model.name" [ERROR ->]#name="ngModel" required /> "): AppComponent@9:16 at TemplateParser.parse (http://localhost:8080/dist/bundle.js:12402:19) at RuntimeCompiler._compileTemplate (http://localhost:8080/dist/bundle.js:30826:51) at http://localhost:8080/dist/bundle.js:30731:83 at Set.forEach (native) at compile (http://localhost:8080/dist/bundle.js:30731:47) at ZoneDelegate.invoke (http://localhost:8080/dist/bundle.js:69130:28) at Zone.run (http://localhost:8080/dist/bundle.js:69023:43) at http://localhost:8080/dist/bundle.js:69389:57 at ZoneDelegate.invokeTask (http://localhost:8080/dist/bundle.js:69163:37) at Zone.runTask (http://localhost:8080/dist/bundle.js:69063:47)consoleError @ zone.js:355_loop_1 @ zone.js:382drainMicroTaskQueue @ zone.js:386 zone.js:357Error: Uncaught (in promise): Error: Template parse errors:(…)consoleError @ zone.js:357_loop_1 @ zone.js:382drainMicroTaskQueue @ zone.js:386
Expected behavior <!-- Describe what the behavior would be without the bug. --> Error should not be thrown and ngModel should work as it normally does.
Minimal reproduction of the problem with instructions <!-- If the current behavior is a bug or you can illustrate your feature request better with an example, please provide the STEPS TO REPRODUCE and if possible a MINIMAL DEMO of the problem via https://plnkr.co or similar (you can use this template as a starting point: http://plnkr.co/edit/tpl:AvJOMERrnz94ekVua0u5). --> I put together an example that is easy to get running at:
Steps to reproduce:
What is the motivation / use case for changing the behavior? <!-- Describe the motivation or the concrete use case --> The example I put together is the best reference.
Please tell us about your environment: <!-- Operating system, IDE, package manager, HTTP server, ... -->
Angular version: 2.1.2 <!-- Check whether this is still an issue in the most recent Angular version -->
Browser: -- Ubuntu 16.04 Chrome Version 54.0.2840.71 (64-bit) -- Ubuntu 16.04 Firefox Version 49.0.2 (64-Bit)
Node (for AoT issues): v4.3.1
I'm getting this error as well. I have FormsModule imported in my child module file. And have no typos
<input [(ngModel)]="name" formControlName="name" ngDefaultControl #fName="ngModel" />