Question

基本上，我的意图是在与Angular之类的路由相同的host/:route（v 9.1）组件中使用路由参数调用函数。

我在app-routing.module.ts中有以下路线：

const routes: Routes = [
  { path: ':route', component: AppComponent }
];

对于同一网址导航，

还重新加载行为：

@NgModule({
  imports: [RouterModule.forRoot(routes,
    {
      onSameUrlNavigation: 'reload'
    })],
  exports: [RouterModule]
})

这就是我在ngOnInit内订阅路由事件的方式：

    this.router.events.subscribe((event: Event) => {
      if (event instanceof NavigationEnd) {
        let route = this.route;
        while (route.firstChild) {
          route = route.firstChild;
        }
        if (!this.routeMappginInitialized) {
          route.params.subscribe(param => {
            if (param.route !== undefined) {
              this.mapRouteToNavigation(param.route);
            }
          });
          this.routeMappginInitialized = true;
        }
      }
    });

这确实有效，但是我想知道这是否是最好的解决方案，尽管我使用的大多数Web框架都使访问/映射路由参数变得容易。

我也尝试过：

this.route.snapshot.paramMap.get('route');

，但它始终返回未定义。

Answer 1

AppComponent是自举组件，因此您不应尝试通过路由加载它。解决此设计问题，它应该可以工作，代码中没有其他错误。

解决同一组件内角线路线的更好方法

1 个答案: