如何从url中获取参数，并将其用于分页，以根据url转到特定页面?角度9

Question

我是angular的新手，我想做点什么。你能告诉我如何根据我的网址更改寻呼机pageIndex和pageSize吗？例如，我的url是：http://localhost:4200/settings/domains/order_by=companies.id&direction=desc&page_ size＝5&第1页

当我从第0页转到下一页时，即为第1页所以我现在想做的是，当我复制上面的链接并将其粘贴到一个新页面并输入I want the table to page 1 not page 0时。我的ts文件代码获取url参数如下：

constructor(private route: ActivatedRoute){
this.route.queryParams.subscribe(params => {
console.log(params);
}
});
}

我在html中的分页实现是：

<mat-paginator #paginator
showFirstLastButtons
[(pageSize)]="pageSize"
[(pageIndex)]="pageIndex"
[pageSizeOptions]="[5, 10, 25, 100]"
(page)="pageEvent = changePage($event)">
</mat-paginator>

这是ts文件中的changePage方法，我用它来更改分页：

changePage(event?: PageEvent) {
this.queryParams.page_size = event.pageSize;
this.queryParams.page = event.pageIndex;
console.log(this.queryParams.page);
this.router.navigate([], {
relativeTo: this.route,
queryParams: this.queryParams,
queryParamsHandling: 'merge',
});
return event;
}

Answer 1

您需要使用ActivatedRoute类中的queryParam对象。

constructor(private activatedRt: ActivatedRoute){
this.activeRt.queryParams.subscribe(param => {
let param = param["my-param"];
let pageRequest = {
pageSize: 5,
pageIndex: param // if this is the page you are pulling from query param
}
this.changePage(pageRequest);
});
}