core.js:5873 ERROR Error: NodeInjector: NOT_FOUND [ControlContainer]
A veces, cuando reinicio el proyecto, funciona perfectamente. Solo hay cambios en 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>En app.module.ts agrego ReactiveFormsModule en mi sección de imports . Recuerde importarlo en la parte superior como: import { ReactiveFormsModule} from '@angular/forms .
En su app.component.ts , debe definir la instancia de FormGroup e inicializarla/registrarla a través del método ngOnInit como se muestra a continuación:
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) }) } Luego vincule el formulario a la instancia de FormGroup myForm :
<form [formGroup]="myForm"> Tenga en cuenta que el name y el email son controles en el formulario que deben vincularse mediante formControlName :
<input type="text" name="name" formControlName="name">tienes que importar ambos, import { FormsModule } from '@angular/forms'; import { ReactiveFormsModule } from '@angular/forms'; en su archivo module.ts correspondiente. eso funcionó para mí.
Me encontré con un escenario similar.
El problema es que a angular v9 ya no le gustaba @Host(). La solución es eliminar @Host() de la declaración de dependencia en el constructor.
En su código, falta formGroup, intente esto: <form [formGroup] = "">
En mi caso, había olvidado poner ReactiveFormsModule en la sección de imports en el archivo .spec.ts correspondiente.
Su pregunta es muy similar a esta pregunta y su código parece faltar [formGroup] como se menciona en esta pregunta:
Angular 5: "Sin proveedor para ControlContainer"
Si prueba su respuesta, ¿funcionaría para usted?
Asegúrese de tener todas las condiciones a continuación configuradas correctamente
En app.module.ts
importar { ReactiveFormsModule } desde '@angular/forms';
@NgModule({ declarations: [], imports: [ ReactiveFormsModule ], providers: [], bootstrap: [] })En app.component.ts
userForm:FormGroup = new FormGroup({ 'username': new FormControl(null,Validators.required), 'password': new FormControl(null,Validators.required), 'confirm-password': new FormControl(null,Validators.required) })En código HTML
<form [formGroup]="userForm"> ...... </form>Encontré el mismo problema con Angular 9 y ya había importado ReactiveFormsModule y FormsModule .
Resulta que el decorador @Host() no funciona con Ivy. La única solución que ayudó fue eliminar @Host() de la declaración de dependencia en el constructor.
El nuevo motor de renderizado angular Ivy no le gusta el decorador @Host().
si está utilizando Modal para Ionic
Luego importa esto
import { FormGroup, FormControl } from '@angular/forms'; //importaciones
al módulo principal del modal.