l-lin / angular-datatables

DataTables with Angular
https://l-lin.github.io/angular-datatables/
MIT License
1.57k stars 481 forks source link

ngTemplateRef cause the issue if visible = false #1789

Closed belics99 closed 2 months ago

belics99 commented 2 months ago

:beetle: bug report

In case we use ngTemplateRef, but we set visible to false we get the next error: ERROR TypeError: Cannot read properties of null (reading 'tagName')

So this blocks rendering the table and the table is stuck on a loading screen,

:microscope: Minimal Reproduction

TS:

{ 
            data: 'some_string', 
            visible: false, 
            name: 'some_string',
            defaultContent: '',
            ngTemplateRef: {ref: this.someCellRef},
            title: 'some_title'
},

HTML:

<ng-template #someCellRef let-data="adtData" let-emitter="captureEvents">
  <app-some-component [data]="data" (emitter)="emitter($event)"></app-some-component>
</ng-template>

:globe_with_meridians: Your Environment

"jquery": "^3.7.1",
"datatables.net": "^2.0.1",
"datatables.net-colreorder": "^2.0.0",
"datatables.net-colreorder-dt": "^2.0.0",
"datatables.net-dt": "^2.0.1",
"datatables.net-responsive": "^3.0.0",
"datatables.net-responsive-dt": "^3.0.0",
"angular-datatables": "^15.0.1",
"@types/datatables.net": "^1.10.28",
"@types/jquery": "^3.5.29",
"@types/node": "^18.15.11",

:memo: Additional context

SOLUTION (that works for me):

{ 
            data: 'some_string', 
            visible: isVisible, 
            name: 'some_string',
            defaultContent: '',
            ngTemplateRef: isVisible? {ref: this.someCellRef}: undefined,
            title: 'some_title'
},
shanmukhateja commented 2 months ago

Hi, this has been fixed in newer version of this library.

Please upgrade to latest version and check again.