angular - 在 Angular 5 中刷新当前路由重定向到父路由

Question

我将 Angular 5 路由配置如下：

  {path: 'malls', component: MallsComponent},
  {
    path: 'malls/new', component: MallEditComponent,
    resolve: {body: MallResolve}
  },
  {
    path: 'malls/:id', component: MallEditComponent,
    resolve: {body: MallResolve}
  },
  {
    path: 'malls/:mallId/point-sales', component: MallPointSalesComponent,
  }

我有一个代码用于在更改一些过滤器/分页/订单参数时重新加载当前页面，如下所示：

private changeFilterRoute() {
  let queryParams = {
    'sorter.sortOrder': this.sort.active,
    'sorter.direction': this.sort.direction,
    'page': this.paginator.pageIndex,
    'pageSize': this.paginator.pageSize
  };

  this.router.navigate(this.route.snapshot.url, {
    queryParams: queryParams
  })
}

每次分页或过滤参数更改时都会调用changeFilterRoute()方法，它应该重新加载当前页面。但不是重新加载当前页面，而是将用户重定向到父路径。

例如我在路上

malls/{:mallId}/point-sales

其中 mallId 只是一个数字。然后我更改了任何分页/过滤参数，调用了changeFilterRoute()方法，并且意外地将我重定向到它的父路由：

商场/:id

用MallResolve处理。请帮助我理解我做错了什么？

Answer 1

问题在于调用您应该像这样router.navigate 从 urlSegments 中提取路径字符串route.snapshot.url

this.router.navigate(this.route.snapshot.url.map(urlSegment => urlSegment.path), {
    queryParams: queryParams
});

Answer 2

试试这个

 constructor(public router: Router, private route: ActivatedRoute,) {}
 ...

 this.router.navigate(['.'], {queryParams: queryParams,  relativeTo: this.route});