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

Man*_*ewa 3 javascript pagination angular-material2 angular

我使用角度为2的材料设计.我想在我的应用程序中使用材质设计分页器,并在组件中获取当前选定的页面索引.paginator插件没有太多文档.这是材料分页器页面:https://material.angular.io/components/paginator/overview

HTML代码

<md-paginator [length]="100"
              [pageSize]="10"
              [pageSizeOptions]="[5, 10, 25, 100]">
</md-paginator>
Run Code Online (Sandbox Code Playgroud)

角2代码

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

Neh*_*hal 12

您可以使用pageOutput事件获取当前页面索引.在$eventpage收益三个部分信息:

  • PageIndex的
  • 页面大小
  • 长度

HTML:

<md-paginator [length]="length"
              [pageSize]="pageSize"
              [pageSizeOptions]="pageSizeOptions"
              (page)="onPaginateChange($event)">
</md-paginator>
Run Code Online (Sandbox Code Playgroud)

TS:

onPaginateChange(event){
    alert(JSON.stringify("Current page index: " + event.pageIndex));
  }
Run Code Online (Sandbox Code Playgroud)

Plunker演示