Angular7:NullInjectorError:FormGroup没有提供者

时间:2019-05-06 10:39:28

标签: angular forms formgroups

我真的很沮丧,因为我不知道发生了什么。 今天早上一切正常,就在我进行一些更改以在ReactiveForm中将2个表单合并在一起之前,现在在浏览器中出现以下错误:

  

错误:StaticInjectorError(AppModule)[FormGroup]:
  StaticInjectorError(平台:核心)[FormGroup]:       NullInjectorError:FormGroup没有提供者!错误:StaticInjectorError(AppModule)[FormGroup]:
  StaticInjectorError(平台:核心)[FormGroup]:       NullInjectorError:没有为FormGroup提供程序!

我正在FormsModule文件中导入ReactiveFormsModuleapp.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
[...]
@NgModule({
  declarations: [
    AppComponent,
    CustomersComponent,
    HeaderComponent,
    CustomersListComponent,
    CustomerEditComponent
  ],
  imports: [
    BrowserModule,
    AppRoutingModule,
    FormsModule,
    ReactiveFormsModule,
    ...
    HttpClientModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

然后是我的组件中的FormGroup:

import { FormGroup, FormControl, Validators } from '@angular/forms';
[...]

然后在组件中声明一个新的FormGroup。 我尝试使用npm重新安装@angular/forms软件包,但仍然出现错误... 我曾问过类似的问题,但据我所知,这与测试环境有关。如果您有任何想法,请先谢谢。

3 个答案:

答案 0 :(得分:3)

不要将FormGroup注入组件的构造函数中。

这不行:

constructor(private fb:FormBuilder,  private ts:FormGroup)

这没关系:

constructor(private fb:FormBuilder)

答案 1 :(得分:0)

我将不得不在构建表单的地方查看您的ts文件。但这听起来像您正在使用反应式表单,但尚未导入所需的所有内容。 ReactiveForms不仅需要:

Lock

,但还要确保在同一导入语句中导入“ FormBuilder”:

 import { FormGroup, FormControl, Validators } from '@angular/forms';

此外,在您的构造函数中,您应该具有以下类似内容:

import { FormBuilder, FormGroup, FormControl, Validators } from '@angular/forms';

,并且表单应该具有表单生成器,用于实例化表单:

constructor(private fb: FormBuilder) {} 

如果这不能解决问题,我将需要更多帮助。

答案 2 :(得分:0)

当输入的不是表单控件时会出现此问题,该控件与任何 Angular 版本或 Form Builder 无关。

要解决此问题,请应用以下任一解决方案,

  1. 表单:FormGroup |任何
  2. 在 tsconfig.json 文件中添加 "strictPropertyInitialization": false .

我就这样解决了:)