How is it possible to change default labels in Material Paginator?

Question

I'm using Material Paginator to paginate my table. My application has RTL style. I need to change the default mat paginator labels (to another language). How is it possible? Can I customize the labels?

Answer 1

In the component you are using material paginator in, add this to.component.ts file

import { MatPaginatorIntl } from '@angular/material/paginator';

export class AppComponent {
  constructor(private paginator: MatPaginatorIntl) {
    paginator.itemsPerPageLabel = "My Items Per Page";
    paginator.firstPageLabel = "First Page Label";
    paginator.nextPageLabel = "My Next Page";
    paginator.previousPageLabel = "My Previous Page";
    paginator.getRangeLabel = (page: number, pageSize: number, length: number) => {
      length = Math.max(length, 0);
      const startIndex = page * pageSize;
      const endIndex =
        startIndex < length
          ? Math.min(startIndex + pageSize, length)
          : startIndex + pageSize;
      return `${startIndex + 1} of ${endIndex} / ${length}`;
    }
  }
  // ...
}

See https://material.angular.io/components/paginator/api#material-paginator-services