Angular app is crashing on import ReactiveFormsModule

JavaScript
1

Hello,

Problem: every time i import ReactiveFormsModule my application crashes.

If i remove the import the application seems to work…The Import is taking place in app.module.ts.
Any ideas as to what I’m doing wrong?

app.module.ts

import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { ReactiveFormsModule } from '@angular/forms';
import { AppComponent }   from './app.component';
import { UserLoginComponent } from './user-login.component';

@NgModule({
  imports:      [ BrowserModule, ReactiveFormsModule],
  declarations: [ AppComponent , UserLoginComponent],    
  bootstrap:    [ AppComponent ]
})
export class AppModule { }

app.component.ts

import { Component } from '@angular/core';

@Component({
  selector: 'my-app',
  template: `<h1>User Login</h1>
              <user-LoginForm></user-LoginForm>`   
})

export class AppComponent { }

user-login.component.ts

 import { Component } from '@angular/core';
import { FormBuilder, Validators } from '@angular/forms';

@Component({
  selector: 'user-LoginForm',
  templateUrl: 'app/views/login-form.component.html' 
})

export class UserLoginComponent { 
}

Error message received:

zone.js:484 Unhandled Promise rejection: Template parse errors:
No provider for ControlContainer ("[ERROR ->]<form  >
    <div class="container1">
        <h2>login: </h2>
"): UserLoginComponent@0:0 ; Zone: <root> ; Task: Promise.then ; Value: Error: Template parse errors:(…) Error: Template parse errors:
No provider for ControlContainer ("[ERROR ->]<form  >
    <div class="container1">
        <h2>login: </h2>
"): UserLoginComponent@0:0
    at TemplateParser.parse (http://localhost:3000/node_modules/@angular/compiler/bundles/compiler.umd.js:8525:21)
    at RuntimeCompiler._compileTemplate (http://localhost:3000/node_modules/@angular/compiler/bundles/compiler.umd.js:16879:53)
    at eval (http://localhost:3000/node_modules/@angular/compiler/bundles/compiler.umd.js:16802:85)
    at Set.forEach (native)
    at compile (http://localhost:3000/node_modules/@angular/compiler/bundles/compiler.umd.js:16802:49)
    at ZoneDelegate.invoke (http://localhost:3000/node_modules/zone.js/dist/zone.js:332:29)
    at Zone.run (http://localhost:3000/node_modules/zone.js/dist/zone.js:225:44)
    at http://localhost:3000/node_modules/zone.js/dist/zone.js:591:58
    at ZoneDelegate.invokeTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:365:38)
    at Zone.runTask (http://localhost:3000/node_modules/zone.js/dist/zone.js:265:48)
2

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.