Changing PrimeNg Version 16 data table paginator icons

214 Views Asked by At

I want to change the next, previous, last, and first paginator icons in the PrimeNg version 16 data table. In version 16, all icons are displayed as SVG. But, I want to replace SVG icons with PrimeNg icons. How can I do that?

I have tried the answers given online. But they are related to older versions of PrimeNg. None of them work for PrimeNg version 16.

Following is the Angular PrimeNg data table.

<p-table [value]="applicants" [paginator]="true" [rows]="10" (onPage)="paginatorChange()" [loading]="tableDataLoading" styleClass="p-datatable-sm p-datatable-gridlines p-datatable-striped text-sm">
  <ng-template pTemplate="header">
    <tr>
      <th class="text-center" pSortableColumn="exam_year" rowspan="2">Exam Year</th>
      <th class="text-center" pSortableColumn="full_name" rowspan="2">Full Name</th>
      <th class="text-center" rowspan="2">Delete</th>
    </tr>
  </ng-template>
  <ng-template pTemplate="body" let-applicant>
    <tr>
      <td class="text-center">{{applicant.exam_year}}</td>
      <td><span class="pl-1 block">{{applicant.full_name}}</span> </td>
      <td class="text-center">
        <button pButton pRipple (click)="onDelete($event, applicant._id)" icon="pi pi-trash" class="p-button-rounded p-button-text">
         </button>
      </td>
    </tr>
  </ng-template>
</p-table>

0

There are 0 best solutions below