primefaces / primeng

The Most Complete Angular UI Component Library
https://primeng.org
Other
10.18k stars 4.54k forks source link

Table: Having any `rowexpansion` template breaks `loadingbody` #16195

Open Xymanek opened 1 month ago

Xymanek commented 1 month ago

Describe the bug

Adding a rowexpansion template makes the table component completely ignore the presence of a loadingbody template.

I believe the problem stems from

https://github.com/primefaces/primeng/blob/512f03d001eeb1479786425931ab14be759e0f97/src/app/components/table/table.ts#L3079-L3144

The loadingBodyTemplate property is not referenced at all in the *ngIf="dt.expandedRowTemplate branch.

Environment

Reproducible in StackBlitz (forked from virtual scroll / lazy loading example in docs)

Reproducer

https://stackblitz.com/edit/scxuay?file=src%2Fapp%2Ftable-virtual-scroll-lazy-demo.html

Angular version

18.1.4

PrimeNG version

17.18.7

Build / Runtime

Angular CLI App

Language

TypeScript

Node version (for AoT issues node --version)

v18.20.3

Browser(s)

FF 129.0

Steps to reproduce the behavior

No response

Expected behavior

The loadingbody template is automatically used even if row expansion is configured (there is nothing to expand anyway while the row is loading)

Xymanek commented 1 month ago

Current workaround if anyone is facing the same issue:

<p-table>

<ng-template pTemplate="body" let-rowData>
    @if (rowData === undefined) {
      <ng-container [ngTemplateOutlet]="loadingRow" />
    } @else {
      <!-- Normal row display -->
    } 
<ng-template/>

<ng-template pTemplate="body" let-rowData>
     <!-- Fallback for whenever this bug is fixed -->
    <ng-container [ngTemplateOutlet]="loadingRow" />
<ng-template/>

<ng-template #loadingRow>
  <!-- Loading placehoders -->
<ng-template/>

</p-table>