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

时间:2017-07-31 05:58:16

标签: javascript angular pagination angular-material2

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

html代码

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

有角度的2代码

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

1 个答案:

答案 0 :(得分:10)

您可以使用page输出事件获取当前页面索引。来自$event的{​​{1}}会返回三条信息:

  • 的PageIndex
  • pageSize的
  • 长度

HTML:

page

TS:

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

Plunker demo