Question

我在Angular 4中创建了一些测试。我有一个使用PrettyJsonCompont的组件，以便向用户显示格式良好的json。

当我运行测试时，我的几个组件测试失败并显示相同的消息。

失败：类型PrettyJsonComponent是2的声明的一部分模块：PrettyJsonModule和DynamicTestModule！请考虑将PrettyJsonComponent移动到更高的导入模块 PrettyJsonModule和DynamicTestModule。您也可以创建一个新的 NgModule导出并包含PrettyJsonComponent然后导入那个NgModule在PrettyJsonModule和DynamicTestModule。

这是我的测试的样子。

import {async, ComponentFixture, TestBed} from '@angular/core/testing';

import {ContentItemModalComponent} from './content-item-modal.component';
import {DialogService} from 'ng2-bootstrap-modal';
import {ContentItemService} from '../services/content-item.service';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import {FroalaEditorModule, FroalaViewModule} from 'angular-froala-wysiwyg';
import {HttpModule} from '@angular/http';
import {MainModel} from '../models/main-model';
import {PrettyJsonComponent, PrettyJsonModule} from 'angular2-prettyjson';

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

  beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [
        ReactiveFormsModule,
        FormsModule,
        FroalaEditorModule.forRoot(),
        FroalaViewModule.forRoot(),
        HttpModule,
        PrettyJsonModule
      ],
      declarations: [ContentItemModalComponent, PrettyJsonComponent],
      providers: [
        DialogService,
        ContentItemService,
        MainModel
      ],
    })
      .compileComponents();
  }));

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

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

Answer 1

问题是configureTestingModule创建了一个新的Angular模块。并在其中声明组件PrettyJsonComponent。但是此组件已在您导入的PrettyJsonModule中声明。一个组件不能在两个模块中声明，并且错误报告的内容。

要解决此问题，请从PrettyJsonComponent声明中删除configureTestingModule。

角度测试失败，因为Component是2个模块声明的一部分

1 个答案: