Question

问题在运行ng测试中发生

context.js：265'e-columns'不是一个已知元素：

如果“ e-columns”是Angular组件，则请验证它是否是此模块的一部分。
如果“ e-columns”是Web组件，则将“ CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“ @ NgModule.schemas”以禁止显示此消息。

app.component.html

          <mks-query>
            <e-columns>
              <e-column field="EmployeeID" label="Employee ID" type="number"></e-column>
              <e-column field="FirstName" label="First Name" type="string"></e-column>
              <e-column field="TitleOfCourtesy" label="Title Of Courtesy" type="boolean"></e-column>
            </e-columns>
          </mks-query>

app.component.ts

import { Component, ViewChild } from '@angular/core';
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
}

app.module.ts

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  exports:[AppComponent],
  imports: [
    BrowserModule,
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

app.componenet.spec.ts

import { TestBed } from '@angular/core/testing';
import { AppComponent } from './app.component';


describe('AppComponent', () => {
  beforeEach(async () => {
    await TestBed.configureTestingModule({
      declarations: [
        AppComponent,
      ],
    }).compileComponents();
  });

  it('should create the app', () => {
    const fixture = TestBed.createComponent(AppComponent);
    const app = fixture.componentInstance;
    expect(app).toBeTruthy();
  });
  
});

Answer 1

有两种可能的解决方案。

如果您需要测试与 e-column 的集成，您需要导入包含它的模块。

await TestBed.configureTestingModule({
  declarations: [
    AppComponent,
  ],
  imports: [ 
    EColumnModule, // I'm guessing the module's name here
  ],
}).compileComponents();

如果不需要这样的集成测试，那么最好将 NO_ERRORS_SCHEMA 包含到配置中。这样，e-column 将被视为通用 HTMLElement。

import { NO_ERRORS_SCHEMA } from '@angular/core';
import { TestBed } from '@angular/core/testing';
import { AppComponent } from './app.component';


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

  it('should create the app', () => {
    const fixture = TestBed.createComponent(AppComponent);
    const app = fixture.componentInstance;
    expect(app).toBeTruthy();
  });
  
});

“ e栏”不是已知元素：

1 个答案: