angular - 在 Angular 中测试组件时如何正确指定哪个组件具有通用类型的输入数据

Question

我想测试一个组件，它可以接受具有不同类型数据的数组是否存在，但 Typescript 显示错误:

Error:(7, 18) TS2314: Generic type 'AppTableComponent<T>' requires 1 type argument(s).

我的组件文件:

export class AppTableComponent<T> {
  @Input() data: T[];

  constructor() {}
}

测试文件

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

  beforeEach(() => {
    TestBed.configureTestingModule({
      declarations: [
        AppTableComponent,
        MockComponent( PreloaderComponent ),
      ],
    }).compileComponents();

    fixture = TestBed.createComponent(AppTableComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

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

如何解决这个错误？

Answer 1

您需要指定一个类型参数，正如错误指示的那样。

由于实际类型参数在您上面指定的测试用例中没有意义，我建议使用 unknown 以获得最大安全性。

let component: AppTableComponent<unknown>;

如果测试涉及分配给输入，您需要在像这样调用 TestBed.createComponent 时明确指定类型参数

 TestBed.createComponent<AppTableComponent<string>>(AppTableComponent);