0

我有一个 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。

不过,这似乎有点低效,有没有另一种方法可以做到这一点而不在每个组件中都包含路由器?

4

1 回答 1

0
[routerLink]="['protected']"

实际上告诉路由器在当前路由器出口中寻找路由。

所以我想你不是在子出口,而是在根出口,对吧?

如果要重定向到受保护,则必须执行以下操作:

[routerLink]="[userTenant, 'protected']"

或者,如果您的第一个租户已设置,

[routerLink]="['first-tenant', 'protected']"
于 2018-01-30T08:15:38.020 回答