"p-menu "不是一个已知的元素。

Question

我的应用程序结构是这样的。

仪表盘模块

-> 超级管理员-仪表板组件

布局模块

-> top-header Component

我试图在超级管理员-仪表盘组件中使用top-header，top-header组件从PrimeNG菜单导入。

问题：当我试图使用选择器调用superadmin-dashboard组件中的top-header组件时，我得到一个警告：p-menu不是一个已知的元素，并且菜单不能工作。

布局模块

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { TopHeaderComponent } from './top-header/top-header.component';
import { LoginComponent } from './login/login.component';
import { FormsModule } from '@angular/forms';
import { SecondHeaderComponent } from './second-header/second-header.component';



@NgModule({
  declarations: [
    TopHeaderComponent,
    LoginComponent,
    SecondHeaderComponent],
  imports: [
    CommonModule,
    FormsModule
  ],
  exports: [
    TopHeaderComponent,
    LoginComponent,
    SecondHeaderComponent,
    FormsModule,
    CommonModule
  ]
})
export class LayoutModule { }

仪表盘模块

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { SuperadminDashboardComponent } from './superadmin-dashboard/superadmin-dashboard.component';
import { CustomerDashboardComponent } from './customer-dashboard/customer-dashboard.component';
import { CardModule } from 'primeng/card';
import { LayoutModule } from '../layout/layout.module';




@NgModule({
  declarations: [SuperadminDashboardComponent, CustomerDashboardComponent],
  imports: [
    CommonModule,
    CardModule,
    LayoutModule

  ],
  exports: [
    SuperadminDashboardComponent,
    CustomerDashboardComponent,
  ]
})
export class DashboardsModule { }

Answer 1

你必须导入 MenuModule 到布局模块中使用 p-menu.在布局模块的任何声明组件内。

布局模块

    import { NgModule } from '@angular/core';
    import { CommonModule } from '@angular/common';
    import { TopHeaderComponent } from './top-header/top-header.component';
    import { LoginComponent } from './login/login.component';
    import { FormsModule } from '@angular/forms';
    import { SecondHeaderComponent } from './second-header/second-header.component';
    import { MenuModule } from 'primeng/menu'; // add this import


    @NgModule({
      declarations: [
        TopHeaderComponent,
        LoginComponent,
        SecondHeaderComponent],
      imports: [
        CommonModule,
        FormsModule,
        MenuModule // use it here
      ],
      exports: [
        TopHeaderComponent,
        LoginComponent,
        SecondHeaderComponent,
        FormsModule,
        CommonModule
      ]
    })
    export class LayoutModule { }