我有一个 Angular 4 webapp,它目前托管一个多租户站点。
一个示例网址将类似于
www.example.com/tenant/
我已按如下方式设置我的路线,以让自己成为“租户守卫”,确保在尝试渲染路线之前始终拥有此属性
const routes: Routes = [
{
path: ':tenant',
canActivate: [TenantGuard, AuthGuard],
children: [
{
path: 'protected',
component: ProtectedComponent,
},
],
},
];
我想要确保我的路由器链接始终包含租户。
目前,我的导航组件看起来像
<nav class="navbar navbar-light bg-faded">
<a class="navbar-brand" [routerLink]="['']">ng-webapp</a>
<ul class="nav navbar-nav">
<li class="nav-item active">
<a class="nav-link" [routerLink]="['']">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" [routerLink]="['protected']">Protected</a>
</li>
</ul>
</nav>
但是,单击“受保护”实际上会将我发送到
www.example.com/protected/
如何在我的子组件上设置任何链接以包含父路由中的租户参数?
www.example.com/tenant/protected/
我考虑的一种方法是传递是ActivatedRoute
从我的子组件周围传递服务并在组件内构造 url。
不过,这似乎有点低效,有没有另一种方法可以做到这一点而不在每个组件中都包含路由器?