Как изменить текст в метке в нумерации страниц?

Question

Я использую угловой материал. Как изменить текст в метке в нумерации страниц? Для метки для селектора размера страницы.

Я пытался это сделать, но не помогло:

<mat-paginator [pageSizeOptions]="[5, 10, 20]" [itemsPerPageLabel]="['The amount of data displayed']" showFirstLastButtons></mat-paginator>

Answer 1

Что ж, похоже, это проблема с mat-paginator с самого начала, и это обсуждалось здесь , поэтому я хотел бы, чтобы вы предложили то же самое при работе вокруг создания одного файла, обратите внимание, что в этот файл мы предоставляем этикетки. этот класс расширяет magpaginator, и в основном файле мы показываем, что мы используем пользовательский класс для нумерации страниц.

называется CustomMatPaginatorIntl

как это

import {MatPaginatorIntl} from '@angular/material';
import {Injectable} from '@angular/core';

@Injectable()
export class CustomMatPaginatorIntl extends MatPaginatorIntl {
  constructor() {
    super();  

    this.getAndInitTranslations();
  }

  getAndInitTranslations() {

      this.itemsPerPageLabel = "test";
      this.nextPageLabel = "test";
      this.previousPageLabel = "test";
      this.changes.next();

  }

 getRangeLabel = (page: number, pageSize: number, length: number) =>  {
    if (length === 0 || pageSize === 0) {
      return `0 / ${length}`;
    }
    length = Math.max(length, 0);
    const startIndex = page * pageSize;
    const endIndex = startIndex < length ? Math.min(startIndex + pageSize, length) : startIndex + pageSize;
    return `${startIndex + 1} - ${endIndex} / ${length}`;
  }
}

и импортируйте его поставщикам в файле main.ts

 providers: [{
      provide: MatPaginatorIntl, 
      useClass: CustomMatPaginatorIntl
    }]

Демо

Вы можете хранить необходимые вещи, удаленные будут использованы из исходного класса