相关疑难解决方法(0)

如何在Angular 4中翻译mat-paginator?

您有什么想法我如何翻译Angular mat-paginator标签中的"每页项目数" ?这mat-paginator是Material Design的一个元素.

material-design angular-material angular

34
推荐指数
4
解决办法
2万
查看次数

Angular MatPaginator无法正常工作

我有2个组件.两者都有mat-table和paginator,并且分页对一个组件起作用,而不是为另一个组件工作,尽管代码类似.下面是我的html:

<div class="mat-elevation-z8">

    <mat-table [dataSource]="dataSource" matSort>

      <ng-container matColumnDef="col1">
        <mat-header-cell *matHeaderCellDef mat-sort-header> Column1 </mat-header-cell>
        <mat-cell *matCellDef="let row"> {{row.col1}} </mat-cell>
      </ng-container>

      <ng-container matColumnDef="col2">
        <mat-header-cell *matHeaderCellDef mat-sort-header> Column2 </mat-header-cell>
        <mat-cell *matCellDef="let row"> {{row.col2}} </mat-cell>
      </ng-container>

      <!-- Different columns goes here -->

      <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
      <mat-row *matRowDef="let row; columns: displayedColumns;">
      </mat-row>
    </mat-table>

    <mat-paginator #scheduledOrdersPaginator [pageSizeOptions]="[5, 10, 20]"></mat-paginator>
  </div>
Run Code Online (Sandbox Code Playgroud)

以下是我在component.ts中的代码:

dataSource: MatTableDataSource<any>;
displayedColumns = ['col1', 'col2', ... ];
@ViewChild('scheduledOrdersPaginator') paginator: MatPaginator;
@ViewChild(MatSort) sort: MatSort;
ngOnInit(): void {
    // Load data
    this.dataSource = new MatTableDataSource(somearray);
    this.dataSource.paginator = …
Run Code Online (Sandbox Code Playgroud)

pagination angular-material angular

33
推荐指数
9
解决办法
3万
查看次数