相对于可变路由参数的Angular routerLink

时间:2019-06-13 07:27:24

标签: angular router angular-routerlink

我有一个Angular应用,其中根目录是一个可变的route参数:

/:demo_profile/(etc).

我不能使用相对路径,因为我的routerLink可从不同的组件/路由获得。

如何设置相对于我的网站根目录的routerLink目标?即

/SomeRoute/home

我的路线:

const routes: Routes = [
  {
    path: ':demo_profile',   
    children: [
      {
        path: '',
        redirectTo: 'home',
        pathMatch: 'full'
      },
      {
        path: 'home',    
        component: HomeComponent,
      },
      {
        path: 'cards',    
        component: CardsComponent,
      },
      {
        path: 'card/:id',    
        component: CardComponent,
      },
      {
        path: 'help',    
        component: HelpComponent,
      },
      {
        path: '**',    
        redirectTo: ':demo_profile',
      }
    ]
  },
  {
    path: '\**',    
    redirectTo: '/DGInsureCo/home',
  }
];

1 个答案:

答案 0 :(得分:0)

虽然不理想,但解决方案包括获取当前URL路径,然后按照以下说明重建路由器链接:

模板中的

routerLink:

<a routerLink="/{{demo_profile}}/home">Home</a>

,然后使用this.demo_profile引用activatedRoute

this.route.params.subscribe( params =>
      this.demo_profile = params['demo_profile']
    )

或:

activatedRoute.snapshot.url[0].path