CODEWITHSUNDEEP
angularimportmodulecomponentsprimeng
Mr Singh
Mr Singh

Reputation: 23

"p-menu" is not a known element

My app Structure is like this:

dashboards Module

-> superadmin-dashboard component

layout Module

-> top-header Component

I am trying to use top-header in superadmin-dashboard component top-header component imports from PrimeNG menu

Problem: When I try to call top-header component in superadmin-dashboard component using the selector, I get a warning that p-menu is not a known element and the menu does not work.

Layout Module

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 { }

dashboards module

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 { }

Upvotes: 2

Views: 5033

Answers (1)

Leonardo Alves
Leonardo Alves

Reputation: 533

You have to import MenuModule into Layout Module to use p-menu. inside of any declared component of Layout Module.

Layout Module

    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 { }

Upvotes: 6

Related Questions