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} / points-sales

其中MallId只是一个数字。然后，我更改了任何分页/过滤参数，调用了 changeFilterRoute（）方法，然后该方法意外地将我重定向到其父路由：

malls /：id

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

Answer 1

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

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});

刷新当前路径将重定向到父路径，而不是在Angular 5中

2 个答案: