当我点击Angular的mat paginator按钮时,有没有方法调用函数
在这4个按钮中,我想使用其中一个作为下一页按钮。如何做到这一点?当我点击Angular的mat paginator按钮时,有没有方法调用函数,angular,typescript,angular-material,paginator,mat-pagination,Angular,Typescript,Angular Material,Paginator,Mat Pagination,在这4个按钮中,我想使用其中一个作为下一页按钮。如何做到这一点? 这是分页器HTML <mat-paginator [pageSize]="2" [pageSizeOptions]="[2, 4, 6]" showFirstLastButtons> </mat-paginator> 这些是typescript代码的相关部分 recordsDataTable:any[]=[ ]; recordsD
这是分页器HTML
<mat-paginator
[pageSize]="2"
[pageSizeOptions]="[2, 4, 6]" showFirstLastButtons>
</mat-paginator>
这些是typescript代码的相关部分recordsDataTable:any[]=[ ];
recordsData !: MatTableDataSource<any>;
@ViewChild(MatPaginator) paginator!: MatPaginator;
ngAfterViewInit()
{
this.userservice.getRecords()
.subscribe(
(x)=>
{
this.recordsDataTable=x.data;
this.recordsData= new MatTableDataSource(x.data);
this.recordsData.paginator = this.paginator;
}
)
}
recordsDataTable:any[]=[];
记录数据!:MatTableDataSource;
@ViewChild(MatPaginator)paginator!:MatPaginator;
ngAfterViewInit()
{
this.userservice.getRecords()
.订阅(
(x) =>
{
this.recordsDataable=x.data;
this.recordsData=新的MatTableDataSource(x.data);
this.recordsData.paginator=this.paginator;
}
)
}
分页器组件为您处理整个分页逻辑。你不需要点击它的按钮。该组件有一个page
事件,可用于处理页面更改
<mat-paginator [length]="length"
[pageSize]="pageSize"
[pageSizeOptions]="pageSizeOptions"
(page)="yourPageChangeLogic($event)">
</mat-paginator>
在角度材质中,Paginator附带了一个事件>(页面)=“getPageDetails($event)”。此事件为我们提供有关该表的信息 在component.ts文件中
getPageDetails(event:any) {
console.log(event);
}
在component.html文件中
<mat-paginator showFirstLastButtons
[length]="totalDataLength"
[pageSize]="pageSize"
[pageSizeOptions]="pageOptions"
(page)="getPageDetails($event)"></mat-paginator>
示例链接:My table有两页,可通过API和访问。一旦使用paginator遍历API 1上的数据,我就必须加载API 2…但是在数据结束时,paginator的“下一页”按钮被禁用。因此我无法从第二个API加载下一页…即使到达最后一页,是否有办法启用“下一页”按钮?我将两个数据连接成一个,然后将其分配给MatTableDataSource和paginator。。。但我需要使用页面事件…@Explorador再传递一个
pageSize
。。