Getting error suddenly in Angular Error: NodeInjector: NOT_FOUND [ControlContainer]

问题

core.js:5873 ERROR Error: NodeInjector: NOT_FOUND [ControlContainer]. Sometime when i restart the project it runs perfectly. there are only changes in app.component.html :

 <div class="container">
  <div class="row">
    <div class="col-md-4">
      <form action="">

        <div class="form-group">
          <label for="">Username</label>
          <input type="text" name="username" class="form-control" />
        </div>
        <div class="form-group">
          <label>Password</label>
          <input type="password" class="form-control">
        </div>
        <div class="form-group">
          <label>Confirm Password</label>
          <input type="password" class="form-control">
        </div>
        <div>
          <button type="submit" class="btn btn-primary btn-block">Register</button>
        </div>
      </form>

    </div>
  </div>
</div>

回答1:

Your question is very similar to this question and your code looks missing [formGroup] as it is mentioned in this question:

Angular 5: "No provider for ControlContainer"

If you try its answer, would that work for you?

回答2:

In my case, I had forgotten to put ReactiveFormsModule to the imports section in the corresponding .spec.ts file.

回答3:

In app.module.ts I add ReactiveFormsModule in my imports section. Remember to import it at the top as: import { ReactiveFormsModule} from '@angular/forms.

In your app.component.ts you have to define FormGroup instance and initialize/register it via ngOnInit method as below:

    import { FormGroup, FormControl } from '@angular/forms'; //imports
.......................................................................
    myForm:FormGroup;  
    ngOnInit(){
         this.myForm = new FormGroup({          
               'name':new FormControl(null), //note, can have up to 3 Constructor Params: default value, validators, AsyncValidators
               'email':new FormControl(null,Validators.email)

          })
    }

Then bind form to the FormGroup instance myForm:

<form [formGroup]="myForm">

Note that name and email are controls in the form that needs binding using formControlName :

<input type="text" name="name" formControlName="name">

回答4:

your code missing formGroup try this

回答5:

you have to import both, import { FormsModule } from '@angular/forms'; import { ReactiveFormsModule } from '@angular/forms'; into your corresponding module.ts file. that worked for me.

回答6:

I ran into a similar scenario.

Issue is that angular v9 didn't liked @Host() any more. Fix is removing @Host() from dependency declaration in the constructor.

https://github.com/angular/angular/issues/31539

回答7:

Replacing the tag with a tag would solve the problem. For some reasons, angular throws an error when you have a form tag.

The good news is that you don't need it anyway.

You may also use if using div would affect your styling.

来源：https://stackoverflow.com/questions/60462708/getting-error-suddenly-in-angular-error-nodeinjector-not-found-controlcontain

标签

angular

mean-stack

mean