Question

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

这看起来效率有点低，是否有另一种方法可以做到这一点而不在每个组件中都包含路由器？

Answer 1

Main

实际上告诉路由器在当前路由器插座中寻找路由。

所以我想你不是在儿童出口，而是在根本出口，对吧？

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

[routerLink]="['protected']"

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

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

Angular 4子路径始终包含来自父级的param

1 个答案: