Angular 失败:模板分析错误:';mat卡标题';不是已知元素
我在两个月前开始使用angular,我设计了一个应用程序,并进行了ng测试。我有一个错误: 失败:模板分析错误: “mat卡标题”不是已知元素: 1.如果“mat card title”是一个角度组件,则确认它是该模块的一部分。 2.如果“mat card title”是一个Web组件,则将“CUSTOM_ELEMENTS_SCHEMA”添加到此组件的“@NgModule.schemas”以抑制此消息。 我不明白什么东西在我的代码中不起作用Angular 失败:模板分析错误:';mat卡标题';不是已知元素,angular,typescript,karma-jasmine,angular-material-8,Angular,Typescript,Karma Jasmine,Angular Material 8,我在两个月前开始使用angular,我设计了一个应用程序,并进行了ng测试。我有一个错误: 失败:模板分析错误: “mat卡标题”不是已知元素: 1.如果“mat card title”是一个角度组件,则确认它是该模块的一部分。 2.如果“mat card title”是一个Web组件,则将“CUSTOM_ELEMENTS_SCHEMA”添加到此组件的“@NgModule.schemas”以抑制此消息。 我不明白什么东西在我的代码中不起作用 import { NgModule } from '@
import { NgModule } from '@angular/core';
import { AppRoutingModule } from './app-routing.module';
import { AppComponent } from './app.component';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { HeroService } from './hero.service';
import { AngularFireAuthModule } from '@angular/fire/auth';
import { AngularFireModule } from '@angular/fire';
import { AngularFirestoreModule } from '@angular/fire/firestore';
import { AngularFireStorageModule } from '@angular/fire/storage';
import { AngularMaterialModule } from './angular-material/angular-material.module';
import { environment } from 'src/environments/environment';
import { FormsModule } from '@angular/forms';
import { ToastrModule } from 'ngx-toastr';
import { HeroesListComponent } from './heroes-list/heroes-list.component';
import { HeroDetailComponent } from './hero-detail/hero-detail.component';
import { HeroSearchComponent } from './hero-search/hero-search.component';
import { HeroTableComponent } from './hero-table/hero-table.component';
import { LoginComponent } from './login/login.component';
import { NavbarHeroesComponent } from './navbar-heroes/navbar-heroes.component';
import { AddHeroesComponent } from './add-heroes/add-heroes.component';
import { HeroGridComponent } from './hero-grid/hero-grid.component';
import { FlexLayoutModule } from '@angular/flex-layout';
@NgModule({
declarations: [
AppComponent,
LoginComponent
],
imports: [
BrowserModule,
AppRoutingModule,
BrowserAnimationsModule,
FormsModule,
AngularFireModule.initializeApp( environment.firebaseConfig ),
AngularFirestoreModule,
FlexLayoutModule,
AngularFireAuthModule,
AngularFireStorageModule,
ToastrModule.forRoot(),
AngularMaterialModule
],
providers: [
HeroService
],
bootstrap: [AppComponent]
})
export class AppModule { }
这是AngularMaterialModule
import { NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
import { CommonModule } from '@angular/common';
import {
MatButtonModule,
MatTableModule,
MatIconModule,
MatFormFieldModule,
MatSelectModule,
MatInputModule,
MatRadioModule,
MatToolbarModule,
MatCardModule,
MatGridListModule,
MatCheckboxModule,
} from '@angular/material';
const moduleAngularMaterial = [
MatButtonModule,
MatIconModule,
MatFormFieldModule,
MatSelectModule,
MatInputModule,
MatTableModule,
MatCheckboxModule,
MatRadioModule,
MatToolbarModule,
MatCardModule,
MatGridListModule
];
@NgModule({
declarations: [
],
imports: [
moduleAngularMaterial,
CommonModule
],
exports: [
moduleAngularMaterial
],
})
export class AngularMaterialModule { }
分散数组值
imports: [...moduleAngularMaterial, CommonModule]
当组件模块处于以下状态时,会出现此类问题:
这可能是您在测试中陷入困境的原因。imports:[…moduleAngularMaterial,CommonModule]尝试仅在根模块或自定义模块中导入它。我解决了这个问题,只需导入我在规范中创建的角材料模块file@Intelligence任何其他解决方案。我现在被困在测试中。