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

Question

I'am using material design with angular 2. I want to use material design paginator for my application and get the current selected page index in the component. There is not much documentation for the paginator plugin.here is the material paginator page: https://material.angular.io/components/paginator/overview

html Code

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

angular 2 code

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

Answer 1

You can get the current page index by using the page Output event. The $event from page returns three pieces of information:

• pageIndex
• pageSize
• length

html:

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

ts:

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

Plunker demo