Can't bind to 'value' since it isn't a known property of 'p-dataTable' Can't bind to 'value' since it isn't a known property of 'p-dataTable' angular angular

Can't bind to 'value' since it isn't a known property of 'p-dataTable'


I have fixed this error. In aspnnetzero there are two files where it needs to import DataTable. I had to import DataTable in app/main/main.module.ts.

main.module.ts

import { NgModule } from '@angular/core';import { CommonModule } from '@angular/common';import { FormsModule } from '@angular/forms';import { DashboardComponent } from './dashboard/dashboard.component';import { CategoriesComponent } from './categories/categories.component';import { CreateOrEditCagoryModalComponent } from './categories/create-or-edit-category-modal.component';import { ModalModule, TabsModule, TooltipModule } from 'ngx-bootstrap';import { AppCommonModule } from '@app/shared/common/app-common.module';import { UtilsModule } from '@shared/utils/utils.module';import { MainRoutingModule } from './main-routing.module';import { CountoModule } from '@node_modules/angular2-counto';import { EasyPieChartModule } from 'ng2modules-easypiechart';import { DataTableModule } from 'primeng/primeng'; // Hereimport { PaginatorModule } from 'primeng/primeng'; // Here@NgModule({    imports: [        CommonModule,        FormsModule,        ModalModule,        TabsModule,        TooltipModule,        AppCommonModule,        UtilsModule,        MainRoutingModule,        CountoModule,        EasyPieChartModule,        DataTableModule, // Added DataTableModule        PaginatorModule //  Added PaginatorModule    ],    declarations: [        DashboardComponent,        CategoriesComponent,        CreateOrEditCagoryModalComponent    ]})export class MainModule { }


If you are using feature modules for Lazy loading you may get this error as well. Even though you have a declaration in app.module.ts. You have to import it in your feature modules as well.

Example: you have a feature module called "pastorders". Then you have to import it in pastorders.module.ts file like below

import { NgModule } from '@angular/core';import { CommonModule } from '@angular/common';import {PastordersRoutingModule} from './pastorders-routing.module';import { PastordersComponent } from './pastorders/pastorders.component';import {DataTableModule} from 'primeng/primeng'; // Declare here@NgModule({  imports: [    CommonModule,    DataTableModule, // declare here     PastordersRoutingModule  ],  declarations: [PastordersComponent]})export class PastordersModule { }

In addition to app.module.ts file declaration.

Note: In the latest version of primeng ( V5 and above) it has been renamed to "TableModule". check your package.json file before making changes.


In new versions of angular, import TableModule from primeng/table.

import { TableModule } from 'primeng/table';@NgModule({       imports: [   // ...   TableModule,   // ...   ]})export class AppModule {}