Error when creating reactive form in angular

Question

I'm getting the following error when creating a reactive form in Angular 10:

No provider for ControlContainer core.js:4127 ERROR Error: NodeInjector: NOT_FOUND [ControlContainer]

HTML Code

    <form [formGroup]="signupForm" (ngSubmit)="onSubmit()">
    
            <div class="form-group">
              <label for="projectName">Project Name</label>
              <input formControlName="projectName" type="text" class="form-control" id="projectName"> 
            </div>
    
            <div class="form-group">
              <label for="email">E-Mail</label>
              <input formControlName="mail" type="text" class="form-control" id="mail"> 
            </div>
    
            <div class="form-group">
              <label for="prjectStatus">Project Status</label>
              <select formControlName="projectStatus" class="form-control" id="prjectStatus">
                <option value="stable">Stable</option>
                <option value="critical">Critical</option>
                <option value="finished">Finished</option>
              </select> 
            </div>
            <div class="form-group">
                <button type="submit" class="btn btn-primary">Submit</button>
            </div>
          </form>

Typescript Code:

     import { Component, OnInit } from '@angular/core';
        import { FormControl, FormGroup } from '@angular/forms';
        
        @Component({
          selector: 'app-root',
          templateUrl: './app.component.html',
          styleUrls: ['./app.component.css']
        })
    
        export class AppComponent implements OnInit {
        
          signupForm: FormGroup;
        
          ngOnInit(): void {
        
            this.signupForm = new FormGroup({
              'projectName' : new FormControl(null),
              'email' : new FormControl(null),
              'projectStatus' : new FormControl('critical')
            });
          }
        }

You will Find your answer here https://stackoverflow.com/questions/48959037/angular-5-no-provider-for-controlcontainer — Abdelmlak Dhif, Dec 02 '20 at 09:39

score 1 · Answer 1 · answered Dec 02 '20 at 06:45

1

Try importing FormsModule in addition to ReactiveFormsModule in the relevant module. (or app module if you want it available globally)

answered Dec 02 '20 at 06:45

Yair Cohen

2,032
7
13

Ahmed Abdelghany · Answer 2 · 2020-12-02T10:46:27.480

0

Solved by adding ReactiveFormsModule to the imports Array of app.module.ts & importing ReactiveFormsModule from '@angular/forms'

edited Dec 02 '20 at 10:46

answered Dec 02 '20 at 10:41

Ahmed Abdelghany

143
2
8

Error when creating reactive form in angular

2 Answers2