【问题标题】:Angular router: (TAB like) navigate - how to change URL without running ngOnInit againAngular 路由器:(类似 TAB 的)导航 - 如何在不再次运行 ngOnInit 的情况下更改 URL
【发布时间】:2018-06-01 04:51:58
【问题描述】:

好的,问题很简单,但是自己好像也没有找到答案,所以请帮忙

我有这条路线(简化):

const routes: Routes = [
  {path: '', component: ListPageComponent},
  {path: 'd/:id', component: DetailsPageComponent},
  {path: ':param1', component: ListPageComponent},
  {path: ':param1/:param2', component: ListPageComponent},
  {path: ':param1/:param2/:param3', component: ListPageComponent},
  {path: '**', component: ListPageComponent}
];

在 ListPageComponent 顶部我有一些选择框过滤器,触发 onFilter 方法(简化):

onFilter(filters: any) {
  this._router.navigate([
    'myroute/',
    this.param1,
    this.param2,
    this.param3
  ]);
}

现在,我想要的是当我触发此方法并导航(到同一个页面组件)时,我不希望该组件再次运行 ngOnInit ......只是为了更改 URL 参数(我是已经订阅了参数更改 - this._route.params.subscribe)

【问题讨论】:

  • 您是否尝试过相对于ActivatedRoute 进行导航?我认为不应该重新加载您的组件,但我不确定,因为我只使用 queryParams 完成了它。
  • 顺便说一句,看看你的路线,因为你正在使用某种表单元素,我认为你应该改用queryParams 更好。
  • @OsmanCea 是对的。使用路由器参数,您将为每条路线拥有不同的组件 - 因此只有在先前的路线具有相同的形状时,您才能拥有相同的组件。但是使用 queryParams,您可以使用一个路由 = 一个组件初始化来描述所有内容。
  • 好吧,它们必须是不同的路线,例如 /myroute/param1/param2/...

标签: angular router


【解决方案1】:

我终于找到了解决办法:Change route params without reloading in angular 2

可以只使用 location.replaceState,在我的情况下就像一个魅力!

【讨论】:

    猜你喜欢
    • 2019-03-28
    • 2021-11-05
    • 2017-02-04
    • 1970-01-01
    • 2020-05-25
    • 1970-01-01
    • 1970-01-01
    • 2019-10-14
    • 1970-01-01
    相关资源
    最近更新 更多