Angular 9 Mat-Paginator - 翻譯

Question

如何在 Angular 9 中翻譯分頁器？

當我添加

paginatorRefresh() {
    setTimeout(() => this.dataSourceAma.paginator = this.paginator);
    this.dataSourceAma.sort = this.sort;
    this.paginator._intl.itemsPerPageLabel = 'Einträge pro Seite';
    this.paginator._intl.getRangeLabel = germanRangeLabel;
    // this.loading = false;
}

我在控制台中收到錯誤消息：

** 類型錯誤：無法讀取未定義的屬性“_intl”**

Answer 1

只需要兩個動作：

在您的模塊中，添加：

providers:[
{ provide: MatPaginatorIntl, useValue: getPortuguesPaginatorIntl() }
]

創建一個文件 paginator.translate.ts

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


const portuguesRangeLabel = (page: number, pageSize: number, length: number) => {
  if (length == 0 || pageSize == 0) { return `0 de ${length}`; }

  length = Math.max(length, 0);

  const startIndex = page * pageSize;

  // If the start index exceeds the list length, do not try and fix the end index to the end.
  const endIndex = startIndex < length ?
    Math.min(startIndex + pageSize, length) :
    startIndex + pageSize;

  return `${startIndex + 1} - ${endIndex} de ${length}`;
}

export function getPortuguesPaginatorIntl() {
  const paginatorIntl = new MatPaginatorIntl();
  paginatorIntl.itemsPerPageLabel = 'Items por página:';
  paginatorIntl.nextPageLabel = 'Próxima página';
  paginatorIntl.previousPageLabel = 'Página anterior';
  paginatorIntl.firstPageLabel = 'Primeira página';
  paginatorIntl.lastPageLabel = 'Ultima página';
  paginatorIntl.getRangeLabel = portuguesRangeLabel;
  return paginatorIntl;
}