Angular 13运行开玩笑的“意外价值”由模块导入的DynamictestModule＆＃x27;。请添加@ngmodule annotati。”

Question

使用命令从Angular运行业力时，我会遇到以下错误： npm运行测试头部

失败src/app/req-form-b​​ody/req-form-b​​ody.component.spec.ts（26.126 s） ●reqformbodyComponent›应该创建

**Unexpected value 'MatTimepickerModule' imported by the module 'DynamicTestModule'. Please add an @NgModule annotation.**

  49 |
  50 |   beforeEach(() => {
> 51 |     fixture = TestBed.createComponent(ReqFormBodyComponent);
     |                       ^
  52 |     component = fixture.componentInstance;
  53 |     fixture.detectChanges();
  54 |   });

  at verifySemanticsOfNgModuleDef (node_modules/@angular/core/fesm2015/core.mjs:23854:19)
  at node_modules/@angular/core/fesm2015/core.mjs:23865:9
      at Array.forEach (<anonymous>)
  at verifySemanticsOfNgModuleDef (node_modules/@angular/core/fesm2015/core.mjs:23863:60)
  at Function.get (node_modules/@angular/core/fesm2015/core.mjs:23825:21)
  at R3TestBedCompiler.applyProviderOverridesToModule (node_modules/@angular/core/fesm2015/testing.mjs:1067:29)
  at R3TestBedCompiler.compileTestModule (node_modules/@angular/core/fesm2015/testing.mjs:1315:14)
  at R3TestBedCompiler.finalize (node_modules/@angular/core/fesm2015/testing.mjs:921:14)
  at TestBedRender3.get testModuleRef [as testModuleRef] (node_modules/@angular/core/fesm2015/testing.mjs:1796:49)
  at TestBedRender3.inject (node_modules/@angular/core/fesm2015/testing.mjs:1719:29)
  at TestBedRender3.createComponent (node_modules/@angular/core/fesm2015/testing.mjs:1759:44)
  at Function.createComponent (node_modules/@angular/core/fesm2015/testing.mjs:1617:37)
  at src/app/req-form-body/req-form-body.component.spec.ts:51:23
  at _ZoneDelegate.Object.<anonymous>._ZoneDelegate.invoke (node_modules/zone.js/bundles/zone-testing-bundle.umd.js:409:30)
  at ProxyZoneSpec.Object.<anonymous>.ProxyZoneSpec.onInvoke (node_modules/zone.js/bundles/zone-testing-bundle.umd.js:3803:43)
  at _ZoneDelegate.Object.<anonymous>._ZoneDelegate.invoke (node_modules/zone.js/bundles/zone-testing-bundle.umd.js:408:56)
  at Zone.Object.<anonymous>.Zone.run (node_modules/zone.js/bundles/zone-testing-bundle.umd.js:169:47)
  at Object.wrappedFunc (node_modules/zone.js/bundles/zone-testing-bundle.umd.js:4288:34)

//，这是我的reqformbodycomponent.spec.ts文件。

在此处输入代码 import {componentFixture，testbed}来自'@angular/core/testing';

import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { FormBuilder, FormControl, FormGroup, Validators } from '@angular/forms';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { MaterialModule } from './../../app/shared/material';
import { ReqFormBodyComponent } from './req-form-body.component';
import { MatTimepickerModule } from 'mat-timepicker';
import _moment from 'moment';
import { default as _rollupMoment } from 'moment';

const moment = _rollupMoment || _moment;

export const DATE_FORMATS = {
  parse: {
    dateInput: 'LL',
  },
  display: {
    dateInput: 'DD-MMM-YYYY',
    monthYearLabel: 'YYYY',
    dateA11yLabel: 'LL',
    monthYearA11yLabel: 'YYYY',
  },
};

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

  beforeEach(async () => {
    await TestBed.configureTestingModule({
      imports: [FormsModule, ReactiveFormsModule, MaterialModule, BrowserAnimationsModule, MatTimepickerModule],
      declarations: [],
      providers: [FormBuilder],
      schemas: [CUSTOM_ELEMENTS_SCHEMA],
    }).compileComponents();
  });

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

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

//相应的组件文件（reqformbodycomponent.ts）

import { StepperSelectionEvent } from '@angular/cdk/stepper';
import { AfterViewInit, ChangeDetectionStrategy, Component, 
ElementRef, OnInit, ViewChild } from '@angular/core';
import { FormBuilder, FormControl, FormGroup, Validators } from
'@angular/forms';
import { MatStepper } from '@angular/material/stepper';

import { MomentDateAdapter, MAT_MOMENT_DATE_ADAPTER_OPTIONS } from '@angular/material-moment-adapter';
import { DateAdapter, MAT_DATE_FORMATS, MAT_DATE_LOCALE } from '@angular/material/core';
import _moment from 'moment';
import { default as _rollupMoment } from 'moment';

const moment = _rollupMoment || _moment;

export const DATE_FORMATS = {
  parse: {
    dateInput: 'LL',
  },
  display: {
    dateInput: 'DD-MMM-YYYY',
    monthYearLabel: 'YYYY',
    dateA11yLabel: 'LL',
    monthYearA11yLabel: 'YYYY',
  },
};

@Component({
  selector: 'ereq-req-form-body',
  templateUrl: './req-form-body.component.html',
  styleUrls: ['./req-form-body.component.scss'],
  changeDetection: ChangeDetectionStrategy.OnPush,
  providers: [
    // `MomentDateAdapter` can be automatically provided by importing `MomentDateModule` in your
    // application's root module. We provide it at the component level here, due to limitations of
    // our example generation script.
    { provide: DateAdapter, useClass: MomentDateAdapter, deps: [MAT_DATE_LOCALE, MAT_MOMENT_DATE_ADAPTER_OPTIONS] },
    { provide: MAT_DATE_FORMATS, useValue: DATE_FORMATS },
  ],
})
export class ReqFormBodyComponent implements OnInit, AfterViewInit {
  @ViewChild('stepper') public stepper: MatStepper;
  public isLinear = false;
  public totalStepCount: number;
  public selectedStep: string;
  public firstFormGroup: FormGroup;
  public secondFormGroup: FormGroup;
  public thirdFormGroup: FormGroup;
  public fourthFormGroup: FormGroup;
  public fifthFormGroup: FormGroup;
  public sixthFormGroup: FormGroup;
  public lastFormGroup: FormGroup;
  public date = new FormControl(moment());
  public defaultValue = { hour: 13, minute: 30 };

  constructor(private formBuilder: FormBuilder) {}

  public ngOnInit(): void {...

Answer 1

您的Angular13测试床找不到开玩笑加载的常春藤兼容库。

您可以逐步解决此

1. 问题：确保您在包装中具有正确的NGCC构建
   node_module文件夹。
2. 步骤：为开玩笑添加一个模式记录器
   包裹