0

I have implemented the pagination in my application using angular .

  1. Is there any way to change the > icon to text labelled "Next" ?

  2. Is there any way I can place only "Rows per page" and "showing" on top and bring the Next arrow icon to the bottom of the table.

  3. Is it possible to exchange the placing of two text , i need swap the placing of text - would want to have "Showing" at first place and then followed by "rows per page" text.

    <mat-paginator #paginator1 [pageSizeOptions]="[5, 10, 20, 50, 100]" aria-label="Select page of periodic elements">

Any help on this is appreciated.

enter image description here

enter image description here

Nancy
  • 911
  • 7
  • 26
  • 54
  • Can I know about your use case why do you want to do it ? – GRD Jan 31 '22 at 05:17
  • Above mentioned requirement is the use case. I need to implement it in my project. – Nancy Jan 31 '22 at 06:57
  • if you want to create a mat-paginator creating your own .html, see this [SO](https://stackoverflow.com/questions/70787342/how-can-i-style-mat-paginator-angular-as-shown/70793916#70793916) . The .html of the mat-paginator is [here](https://github.com/angular/components/blob/c5cede87c3610b090154f7c7b55cc536b043cc1d/src/material/paginator/paginator.html) just fell free to change anything in .html – Eliseo Jan 31 '22 at 20:32
  • Does this answer your question? [Angular Material Pagination - How to replace first and last icons with text?](https://stackoverflow.com/questions/69191704/angular-material-pagination-how-to-replace-first-and-last-icons-with-text) – Henry Woody Dec 22 '22 at 00:31

0 Answers0