Import primeng TableModule gives error in Angular2

Question

I'm trying to run a very simple primeng table app. I installed primeng and primeicons. When I add this import in app.module.ts:

import { TableModule } from 'primeng/table';

It gives an error when compiling:

Error: node_modules/primeng/table/table.d.ts:375:18 - error TS2707: Generic type 'ɵɵComponentDeclaration' requires between 7 and 8 type arguments.

375 static ɵcmp: i0.ɵɵComponentDeclaration<TableBody, "[pTableBody]", never, { "columns": "pTableBody"; "template": "pTableBodyTemplate"; "value": "value"; "frozen": "frozen"; "frozenRows": "frozenRows"; "scrollerOptions": "scrollerOptions"; }, {}, never, never, false, never>; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Error: node_modules/primeng/table/table.d.ts:382:18 - error TS2707: Generic type 'ɵɵDirectiveDeclaration' requires between 6 and 8 type arguments.

382 static ɵdir: i0.ɵɵDirectiveDeclaration<RowGroupHeader, "[pRowGroupHeader]", never, {}, {}, never, never, false, never>; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Error: node_modules/primeng/table/table.d.ts:394:18 - error TS2707: Generic type 'ɵɵDirectiveDeclaration' requires between 6 and 8 type arguments.

394 static ɵdir: i0.ɵɵDirectiveDeclaration<FrozenColumn, "[pFrozenColumn]", never, { "frozen": "frozen"; "alignFrozen": "alignFrozen"; }, {}, never, never, false, never>; ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

Error: node_modules/primeng/table/table.d.ts:412:18 - error TS2707: Generic type 'ɵɵDirectiveDeclaration' requires between 6 and 8 type arguments.

412 static ɵdir: i0.ɵɵDirectiveDeclaration<SortableColumn, "[pSortableColumn]", never, { "field": "pSortableColumn"; "pSortableColumnDisabled": "pSortableColumnDisabled"; }, {}, never, never, false, never>;

What is it wrong here? Package.json:

"dependencies": {
    "@angular/animations": "^14.0.0",
    "@angular/common": "^14.0.0",
    "@angular/compiler": "^14.0.0",
    "@angular/core": "^14.0.0",
    "@angular/forms": "^14.0.0",
    "@angular/platform-browser": "^14.0.0",
    "@angular/platform-browser-dynamic": "^14.0.0",
    "@angular/router": "^14.0.0",
    "primeicons": "^6.0.1",
    "primeng": "^15.0.0-rc.1",
    "rxjs": "~7.5.0",
    "tslib": "^2.3.0",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "^14.0.0",
    "@angular/cli": "~14.0.0",
    "@angular/compiler-cli": "^14.0.0",
    "@types/jasmine": "~4.0.0",
    "jasmine-core": "~4.1.0",
    "karma": "~6.3.0",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage": "~2.2.0",
    "karma-jasmine": "~5.0.0",
    "karma-jasmine-html-reporter": "~1.7.0",
    "typescript": "~4.7.2"
  }

score 2 · Accepted Answer · answered Nov 25 '22 at 14:22

2

The problem I think is that you are using the v15 primeng (rc too) with angular v14. Upgrade your Angular version or downgrade your primeng version so they match.

The official example works just fine without any errors: https://stackblitz.com/edit/primeng-tabledoc-demo?file=src%2Fapp%2Fapp.module.ts you can check the versions for it from there.

answered Nov 25 '22 at 14:22

ForestG

17,538
14
52
86

I copy-pasted dependencies and dev-dependencies from this example, run 'npm i --force' and 'npm start' and got the following error: [error] Error [ERR_REQUIRE_ESM]: require() of ES Module C:\MyDocuments\General\JavaScript\angular\prime-ng-table-reorder\table-order-demo\node_modules\@angular\compiler\fesm2015\compiler.mjs not supported. – SimonD Nov 28 '22 at 08:09

Import primeng TableModule gives error in Angular2

1 Answers1