错误:运行ng test时出现StaticInjectorError[FormBuilder]

11

我刚开始使用ng test来验证我的Angular应用程序。我使用Angular-Cli生成我的模块和组件,并且.spec.ts是默认的。

我在一个测试中得到了以下内容:

错误:StaticInjectorError [FormBuilder]:
StaticInjectorError [FormBuilder]: NullInjectorError:没有为FormBuilder提供程序!

它失败的组件有以下声明:

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

我的构造函数只是简单地创建了一个FormBuilder。

constructor(private fb: FormBuilder) { }

我也在我的app.module中声明了表单构建器。

import { FormGroup, FormBuilder, Validators } from '@angular/forms';
 imports: [
    BrowserModule,
    AdminModule,
    AppRoutingModule,
    FormsModule,
    ReactiveFormsModule,
    FormBuilder,
    HttpModule,
    NgbModule.forRoot()

测试代码

import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { CreatearchiveComponent } from './createarchive.component';
import { NO_ERRORS_SCHEMA } from '@angular/core';

describe('CreatearchiveComponent', () => {
  let component: CreatearchiveComponent;
  let fixture: ComponentFixture<CreatearchiveComponent>;

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      declarations: [ CreatearchiveComponent ],
      schemas: [NO_ERRORS_SCHEMA]
    })
    .compileComponents();
  }));

  beforeEach(() => {
    fixture = TestBed.createComponent(CreatearchiveComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should create', () => {
    expect(component).toBeTruthy();
  });
});

你的应用程序模块是无关紧要的。重要的是在你的测试中配置的测试模块。 - JB Nizet
请提供您的测试吗?我认为您只是忘记将 ReactiveFormsModule 添加到您的测试模块配置中。 - Armen Vardanyan
未来参考:除非确实需要,否则请避免使用NO_ERRORS_SCHEMA,最好的解决方案是通过存根引用来隔离您的组件。请参阅文档:https://angular.io/guide/testing-components-scenarios#no_errors_schema - PLB
2个回答

19

您的测试使用了一个只有CreatearchiveComponent的测试angular模块,但没有导入ReactiveFormsModule。因此,由ReactiveFormsModule提供的FormBuilder服务不可用。您需要导入组件所需的模块:

TestBed.configureTestingModule({
  declarations: [ CreatearchiveComponent ],
  imports: [ReactiveFormsModule],
  schemas: [NO_ERRORS_SCHEMA]
})

0
请勿在构造函数中创建FormGroup实例。请在组件类的顶部创建FormGroup实例,并在代码中使用相同的实例。

我很想知道为什么你不应该这样做? - Mehrad
我认为这里有一点混淆。 OP遇到的问题与FormBUILDER有关,需要在构造函数中注入。 这个答案提到了FormGROUP,需要实例化(使用“new”)。您可以在文档中看到:https://angular.io/guide/reactive-forms#creating-nested-form-groups我有点惊讶OP同时引入了它们,但也许他需要它们。从测试的角度来看,据我所知它们都不容易被隔离。因此,导入“ReactiveFormsModule”就可以解决问题。 - PLB

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接