How to use MatPaginatorIntl?

I'm using MatPaginator component and I'm trying to figure out how to translate those labels (documentation isn't clear enough about this).

I've found this article showing how to do this and I followed the steps:

1 - I created a file called custom-paginator.ts and put the following there:

import { MatPaginator, MatPaginatorIntl } from '@angular/material';

export class CustomPaginator extends MatPaginatorIntl {
constructor() {
super();
this.nextPageLabel = ' My new label for next page';
this.previousPageLabel = ' My new label for previous page';
this.itemsPerPageLabel = 'Task per screen';
}
}


2 - In app.module.ts I put:

@NgModule({
// ...
providers: [
{
provide: MatPaginatorIntl,
useClass: CustomPaginator
}
]
})
export class AppModule


However, it simply doesn't change nothing. What am I missing?

Continue reading...