PrimeNG 10.0.3 - 错误 NG8001:'p-tabView' 不是已知元素
PrimeNG 10.0.3 - error NG8001: 'p-tabView' is not a known element
我在 angular 10 应用程序中使用 PrimeNG 10.0.3。我在其中导入了几个 PrimeNG 组件并毫无问题地使用它们。但是,当我尝试使用 TabView 模块时,出现 error NG8001: 'p-tabView' is not a known element 以及 error NG8001: 'p-tabPanel' 不是已知元素.
我创建了一个名为 primng.module 的模块,我在其中托管所有 PrimeNG 导入:
import { NgModule } from '@angular/core';
import { ButtonModule } from 'primeng/button';
import { BlockUIModule } from 'primeng/blockui';
import { ToastModule } from 'primeng/toast';
import { DialogModule } from 'primeng/dialog';
import { ConfirmDialogModule } from 'primeng/confirmdialog';
import { OverlayPanelModule } from 'primeng/overlaypanel';
import { PanelModule } from 'primeng/panel';
import { CardModule } from 'primeng/card';
import { SidebarModule } from 'primeng/sidebar';
import { InputMaskModule } from 'primeng/inputmask';
import { PasswordModule } from 'primeng/password';
import { TableModule } from 'primeng/table';
import { TabViewModule } from 'primeng/tabview';
import { ConfirmationService, MessageService } from 'primeng/api';
@NgModule({
imports: [
],
exports: [
ButtonModule,
BlockUIModule,
ToastModule,
DialogModule,
ConfirmDialogModule,
OverlayPanelModule,
PanelModule,
CardModule,
SidebarModule,
InputMaskModule,
PasswordModule,
TableModule,
TabViewModule
],
providers: [
MessageService,
ConfirmationService
]
})
export class PrimengModule { }
然后我将这个模块导入为:
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { PrimengModule } from '../../primeng.module';
...
const routes: Routes = [
...
];
@NgModule({
declarations: [
...
],
imports: [
RouterModule.forChild(routes),
PrimengModule
],
exports: [
RouterModule
]
})
export class AdminRoutingModule { }
最后,我将 TabView 用作:
<p-tabView>
<p-tabPanel header="Header 1">
Content 1
</p-tabPanel>
<p-tabPanel header="Header 2">
Content 2
</p-tabPanel>
<p-tabPanel header="Header 3">
Content 3
</p-tabPanel>
</p-tabView>
我在使用任何其他模块时都没有问题,只有 TabView。
我错过了什么?
谢谢。
好的,事实证明这与 PrimeNG 无关。我有 p-tabView 标记的托管组件被错误地声明在另一个模块中,该模块对我的 primeng.module.ts 一无所知,自然不知道如何处理 TabView。
经验教训:注意在哪个模块中声明每个组件。确保模块了解您需要在组件中使用的功能。
我在 angular 10 应用程序中使用 PrimeNG 10.0.3。我在其中导入了几个 PrimeNG 组件并毫无问题地使用它们。但是,当我尝试使用 TabView 模块时,出现 error NG8001: 'p-tabView' is not a known element 以及 error NG8001: 'p-tabPanel' 不是已知元素.
我创建了一个名为 primng.module 的模块,我在其中托管所有 PrimeNG 导入:
import { NgModule } from '@angular/core';
import { ButtonModule } from 'primeng/button';
import { BlockUIModule } from 'primeng/blockui';
import { ToastModule } from 'primeng/toast';
import { DialogModule } from 'primeng/dialog';
import { ConfirmDialogModule } from 'primeng/confirmdialog';
import { OverlayPanelModule } from 'primeng/overlaypanel';
import { PanelModule } from 'primeng/panel';
import { CardModule } from 'primeng/card';
import { SidebarModule } from 'primeng/sidebar';
import { InputMaskModule } from 'primeng/inputmask';
import { PasswordModule } from 'primeng/password';
import { TableModule } from 'primeng/table';
import { TabViewModule } from 'primeng/tabview';
import { ConfirmationService, MessageService } from 'primeng/api';
@NgModule({
imports: [
],
exports: [
ButtonModule,
BlockUIModule,
ToastModule,
DialogModule,
ConfirmDialogModule,
OverlayPanelModule,
PanelModule,
CardModule,
SidebarModule,
InputMaskModule,
PasswordModule,
TableModule,
TabViewModule
],
providers: [
MessageService,
ConfirmationService
]
})
export class PrimengModule { }
然后我将这个模块导入为:
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { PrimengModule } from '../../primeng.module';
...
const routes: Routes = [
...
];
@NgModule({
declarations: [
...
],
imports: [
RouterModule.forChild(routes),
PrimengModule
],
exports: [
RouterModule
]
})
export class AdminRoutingModule { }
最后,我将 TabView 用作:
<p-tabView>
<p-tabPanel header="Header 1">
Content 1
</p-tabPanel>
<p-tabPanel header="Header 2">
Content 2
</p-tabPanel>
<p-tabPanel header="Header 3">
Content 3
</p-tabPanel>
</p-tabView>
我在使用任何其他模块时都没有问题,只有 TabView。
我错过了什么?
谢谢。
好的,事实证明这与 PrimeNG 无关。我有 p-tabView 标记的托管组件被错误地声明在另一个模块中,该模块对我的 primeng.module.ts 一无所知,自然不知道如何处理 TabView。
经验教训:注意在哪个模块中声明每个组件。确保模块了解您需要在组件中使用的功能。