angular - 如何使用 mat-tab？mat-tab 不是已知元素错误

Question

我正在尝试使用mat-tab. 我在html中添加了以下代码

<mat-tab-group>
    <mat-tab label="Tab 1"> <app-latest-article></app-latest-article></mat-tab>
    <mat-tab label="Tab 2">  <app-trending-article></app-trending-article> </mat-tab>
</mat-tab-group>

在 ts 文件中

import {MatTabsModule} from '@angular/material/tabs';

我收到错误

未捕获的错误：模板解析错误：
'mat-tab' 不是已知元素：
1. 如果 'mat-tab' 是 Angular 组件，则验证它是否是此模块的一部分。
2. 如果“mat-tab”是一个 Web 组件，则将“CUSTOM_ELEMENTS_SCHEMA”添加到该组件的“@NgModule.schemas”以禁止显示此消息。("
</ngx-tabset> -->

标签： angulartypescriptangular-materialmat-tab

Answer 1

在您的 module.ts 文件中添加导入并将其添加到导入中（如果您使用多个 module.ts 文件，请将其添加到负责您的组件的文件中）。

import { MatTabsModule } from '@angular/material';

@NgModule({
  imports: [
    ...
    MatTabsModule,
    ...
  ],
  declarations: [
    ...
  ],
  providers: []
})

export class AppModule {}