我有一个 Angular 11 Web 应用程序，使用 <mat-paginator>像这样...
<mat-paginator [length]="11"
[pageSize]="10"
[pageSizeOptions]="[5, 10, 25]"
</mat-paginator>
它显示Showing 1-10 of 11 ...但实际上超过 11 个。我只知道是否超过 11 个，由于技术原因我没有总数。
当您点击“下一步”时，它会变成 Showing 11-20 of 21 (因为我知道有超过 20 个)。
有没有办法隐藏文本的“of 11”部分？
最佳答案
x 的标签 1-10 由 MatPaginatorIntl.getRangeLabel(...) 方法返回 正如我们在这里看到的 https://github.com/angular/components/blob/7cc42f5d835b7971e9ff73e220b801cf7834d515/src/material/paginator/paginator.html#L31
因此，我们可以从技术上创建一个扩展 MatPaginator 的类，并提供一个自定义的 MatPaginatorIntl 及其自己的 getRangeLabel() 实现。 首先扩展MatPaginatorIntl国际化类
export class CustomPaginatorIntl extends MatPaginatorIntl{
constructor(){
super();
}
getRangeLabel: (page: number, pageSize: number, length: number){
return `${page * pageSize + 1} – ${startIndex + pageSize}`;
}
}
然后，您在 app.module.ts 中提供 CustomPaginatorIntl:
providers: [{ provide: MatPaginatorIntl, useClass: CustomPaginatorIntl}]
关于angular - 有没有办法隐藏 <mat-paginator> 的长度，使其为 "1-10"而不是 "1-10 of 100"？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/67232478/