I recently integrated the PrimeNG library into my Angular 4 project. Everything seems to be in place as I can see PrimeNG in my dependencies and nodemodules folder. However, when I tried to implement a simple data table using the following code:
<p-dataTable >
<p-column ></p-column>
<p-column ></p-column>
<p-column ></p-column>
<p-column ></p-column>
</p-dataTable>
I encountered an error in my browser's console:
Unhandled Promise rejection: Template parse errors:
'p-column' is not a known element:
1. If 'p-column' is an Angular component, then verify that it is part of this module.
2. If 'p-column' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message. ("
<p-dataTable >
[ERROR ->]<p-column ></p-column>
<p-column ></p-column>
<p-column ></p-column>
"): ng:///AppModule/TableaudebordComponent.html@5:4
Below is a snippet from my app.module.ts file:
import { TableaudebordComponent } from './tableaudebord.component';
import { RouterModule, Routes } from '@angular/router'
import { ToggleComponent } from './toggle.component';
import { HttpModule } from '@angular/http';
import { routeConfig } from './router-config';
import { AppComponent } from './app.component';
import { UserService } from './user.service'; // <-- #1 import service
@NgModule({
imports: [ BrowserModule, HttpModule, RouterModule.forRoot(routeConfig)
],
declarations: [ AppComponent, DashboardComponent, PageNotFoundComponent, NavbarComponent,PetitPaveInfraComponent, PaveInfraComponent, PetitPaveAppliComponent, DashboardnextComponent, Dashboardnext2Component, Dashboardnext3Component, PetitPaveProblemComponent, PaveProblemComponent, ToggleComponent, TableaudebordComponent ],
providers: [ UserService ],
bootstrap: [ AppComponent ]
})
export class AppModule { }