CODEWITHSUNDEEP
angularprimeng
Joe
Joe

Reputation: 13141

Angular - PrimeNG not consistent with number of rows in pagination

I start working with a library PrimeNG in Angular and it mostly looks good but have problem with showing e.g. 20 rows constantly. What happens is at the default page it shows 20, then on the next page shows 60 (it should be 20 again), then it shows 60 again (it should be 20) and then towards the end it shows a good number. Here is the code for table part:

            <p-table [columns]="cols" [value]="questions" class="ui-g-12" sortField="id" 
        columnResizeMode="fit" [resizableColumns]="true" selectionMode="single" 
[(selection)]="selectedQuestion" (onRowSelect)="onRowSelect($event)" [paginator]="true" 
    rows="20" [rowsPerPageOptions]="[5,10,15,20]"
                    [pageLinks]="8">

                    <ng-template pTemplate="header" let-columns>
                        <tr>
                            <th *ngFor="let col of columns">
                                {{col.header}}
                            </th>
                        </tr>
                    </ng-template>

                    <ng-template pTemplate="body" let-rowData let-columns="columns">
                        <tr [pSelectableRow]="rowData">
                            <td *ngFor="let col of columns">
                                {{rowData[col.field]}}
                            </td>
                        </tr>
                    </ng-template>

                    <ng-template pTemplate="summary" let-rowData>

                    </ng-template>
                </p-table>

Upvotes: 1

Views: 1364

Answers (1)

Cagatay Civici
Cagatay Civici

Reputation: 6504

rows="20" is a string, you need to use binding,

[rows]="20"

Upvotes: 1

Related Questions