Cómo cambiar itemsPerPageLabel en mat-paginator en Angular 6+

Después de mucho batallar pudimos hallar la contestación de este inconveniente que muchos los usuarios de esta web presentan. Si tienes alguna información que aportar no dejes de dejar tu comentario.

Solución:

Cree un nuevo archivo TypeScript y agregue una función que se exporte y devuelva un MatPaginatorIntl objeto.

Para modificar las etiquetas y el texto que se muestra, cree una nueva instancia de MatPaginatorIntl e inclúyala en un proveedor personalizado: Material angular – Paginador > API

CustomPaginatorConfiguration.ts

import  MatPaginatorIntl  from '@angular/material';

export function CustomPaginator() 
  const customPaginatorIntl = new MatPaginatorIntl();

  customPaginatorIntl.itemsPerPageLabel = 'Custom_Label:';

  return customPaginatorIntl;

Luego añádelo a app.module.ts:

import  MatPaginatorIntl  from '@angular/material';
import  CustomPaginator  from './app/CustomPaginatorConfiguration';

@NgModule(
  // ...
  providers: [
     provide: MatPaginatorIntl, useValue: CustomPaginator() 
  ]
)

También puede establecer la configuración para un componente en particular como:

import  CustomPaginator  from './CustomPaginator';
import  MatPaginatorIntl  from '@angular/material';
/**
 * @title Paginator
 */
@Component(
  selector: 'your_component',
  templateUrl: 'your_component.html',
  providers: [
     provide: MatPaginatorIntl, useValue: CustomPaginator()   // Here
  ]
)

ApilarBlitz

 @ViewChild(MatPaginator,  static: true ) paginator: MatPaginator;

  ngOnInit() 
    this.paginator._intl.itemsPerPageLabel="Test String";

  

Después de declarar el paginador, este texto se puede modificar en ngOnInit()

valoraciones y reseñas

---

---

Utiliza Nuestro Buscador