angular 2 material paginator獲取當前頁面索引

Question

我使用角度為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
}

Answer 1

您可以通過使用獲得當前頁面的索引page輸出的事件。 來自page的$event返回三條信息：

• PageIndex的
• 頁面大小
• 長度

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演示