I m using primeng 8.1 with angular 8
I refer my p-table with #dt then i call dt.reset() and getcandidates() to refresh
But it shows first page of p-table without refreshing list i searched in official documentation but i don't find a solution so the only way to refresh data is to reload entire navigator page
<p-table #dt
[paginator]="true"
[columns] = "cols"
[value]="listcandidats"
[totalRecords]="listcandidats.length"
[paginator]="true"
[rows]="5"
[style.top.px]="screenHeight/6"
>
<ng-template pTemplate="caption">
<div style="text-align: right">
<i class="fa fa-search" style="margin:4px 4px 0 0"></i>
<input type="text" pInputText size="50" placeholder="Recherche multioption"
(input)="dt.filterGlobal($event.target.value, 'contains')" style="width:auto">
</div>
</ng-template>
<ng-template pTemplate="header" let-columns>
<tr>
<th>Candidat</th>
<th>Action</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-rowData >
<tr [pSelectableRow]="rowData" >
<td [style.width.px]="screenWidth/8"> <h3>{{rowData.nom}}</h3></td>
<td>
<button pButton type="button" label="modifier" (click)="showDialog(rowData.id)" class="ui-
button-rounded ui-button-warning">
</button>
<button pButton type="button" label="supprimer"
(click)="deletecandidat(rowData.id);dt.reset();getcandidats()" class="ui-button-rounded ui-
button-danger"></button>
</td>
</tr>
<hr [style.width.px]="screenWidth">
</ng-template>
</p-table>
As per PrimeNg Document
Table may need to be aware of changes in its value in some cases such as reapplying sort. For the sake of performance, this is only done when the reference of the value changes meaning a setter is used instead of ngDoCheck/IterableDiffers
which can reduce performance. So when you manipulate the value such as removing or adding an item, instead of using array
methods such as push
, splice
create a new array reference using a spread operator or similar.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With