PrimeNG p-footer is not a known element bug in angular 2

Question

I am new to using PrimeNG and I need a confirmation dialog. I read the documentation on the confirmation dialog and implemented it on my component.

my-component.ts

import { ConfirmDialogModule, ConfirmationService } from 'primeng/primeng'; 

my-component.html

  <p-confirmDialog header="Order Confirmation" icon="fa fa-question-circle" width="425" #cd> <p-footer> <button type="button" pButton icon="fa-close" label="No" (click)="cd.reject()"></button> <button type="button" pButton icon="fa-check" label="Yes" (click)="cd.accept()"></button> </p-footer> </p-confirmDialog> 

app.module.ts

 import { ConfirmDialogModule, ConfirmationService } from 'primeng/primeng'; @NgModule({ declarations: [ ], imports: [ BrowserModule, ConfirmDialogModule, FormsModule, ReactiveFormsModule, HttpModule, AppRoutingModule ], providers: [ConfirmationService], bootstrap: [AppComponent] }) export class AppModule { } 

Anything I missed causes an error? Please enlighten me.

Answer 1

Got! I just need to import the SharedModule in order to use it.

 import { ConfirmDialogModule, ConfirmationService, SharedModule } from 'primeng/primeng'; 

then include it in @NgModule

 @NgModule({ declarations: [ ], imports: [ ConfirmDialogModule, SharedModule ], providers: [ConfirmationService], bootstrap: [AppComponent] }) 

Answer 2

Due to the fact that the header and footer are reserved, PrimeNG changed them to p-header and p-footer and yes, they are inside the SharedModule.