javascript - angular 2 material paginator获取当前页面索引

Question

我正在使用带 Angular 2 的 Material 设计。我想为我的应用程序使用 Material 设计分页器，并在组件中获取当前选定的页面索引。 paginator 插件的文档不多。这里是 material paginator 页面:https://material.angular.io/components/paginator/overview

html代码

<md-paginator [length]="100"
              [pageSize]="10"
              [pageSizeOptions]="[5, 10, 25, 100]">
</md-paginator>

angular 2代码

@Component({
  selector: 'paginator-overview-example',
  templateUrl: 'paginator-overview-example.html',
})
export class PaginatorOverviewExample {
   //I want to get page change event here
}

Answer 1

您可以使用page Output 事件获取当前页面索引。 page 中的 $event 返回三个信息:

• 页面索引
• 页面大小
• 长度

html:

<md-paginator [length]="length"
              [pageSize]="pageSize"
              [pageSizeOptions]="pageSizeOptions"
              (page)="onPaginateChange($event)">
</md-paginator>

:

onPaginateChange(event){
    alert(JSON.stringify("Current page index: " + event.pageIndex));
  }

Plunker demo