Is it advisable to include PrimeNg references in multiple modules or should they be centralized in a shared module? What is the recommended practice in this scenario? I am encountering issues with importing "p-dataTable" from primeng even though it is included in the module where the component is declared.
The error message I am receiving is related to my HTML code in validation.component.html:
errors.ts:42 ERROR Error: Uncaught (in promise): Error: Template parse errors:
Can't bind to 'value' since it isn't a known property of 'p-dataTable'.
1. If 'p-dataTable' is an Angular component and it has 'value' input, then verify that it is part of this module.
2. If 'p-dataTable' is a Web Component then add 'CUSTOM_ELEMENTS_SCHEMA' to the '@NgModule.schemas' of this component to suppress this message.
3. To allow any property add 'NO_ERRORS_SCHEMA' to the @NgModule.schemas' of this component. ("
<body>
<h3>Validation tabs go here.</h3>
<p-dataTable [ERROR ->][value]="validationsList" selectionMode="single" [(selection)]="selectedValidation" dataKey="id"
"): ng:///app/validation/validation.component.html@7:17
I have a file named validation.module.ts
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { SharedModule } from "../shared/shared.module";
import { ValidationComponent } from "./validation.component";
import { SampleIdsTableComponent } from "./sampleIdsTable.component";
import { AllTestsComponent } from "./allTests.component";
import { RunStatusComponent } from "./runStatus.component";
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { NglModule } from 'ng-lightning/ng-lightning';
import {
SharedModule as Prime_SharedModule,
TabMenuModule, AccordionModule, MenuModule, MenubarModule, SelectButtonModule,
CalendarModule, InputTextareaModule, DataTableModule, ChartModule, DataGridModule
} from 'primeng/primeng';
@NgModule({
imports: [
SharedModule,
RouterModule.forChild([
{
path: '',
component: ValidationComponent,
children: [
{
path: '',
pathMatch: 'full'
},
{
path: 'samples',
component: SampleIdsTableComponent
},
{
path: 'allTests',
component: AllTestsComponent
},
{
path: 'runStatus',
component: RunStatusComponent
}
]
},
Prime_SharedModule,
TabMenuModule,
NgbModule.forRoot(),
NglModule.forRoot(),
AccordionModule,
DataTableModule,
MenuModule,
MenubarModule,
SelectButtonModule,
CalendarModule,
ChartModule,
InputTextareaModule,
DataGridModule
])
],
declarations: [
ValidationComponent,
SampleIdsTableComponent,
AllTestsComponent,
RunStatusComponent
],
providers: [
]
})
export class ValidationModule { }