一个Angular组件的2条路由

Question

我想知道是否有可能有2个不同的路由指向1个单一组件？ 例如：

{ path: 'signin', component: SignInComponent },
{ path: 'tenant/:id/signin', component: SignInComponent }

我问，因为我有一些有线行为..

Answer 1

是的，您可以使用指向同一组件的2种不同路线。 但是，当您从路径导航到使用与先前路径相同的组件的其他路径时，angular会重新使用您的组件实例。 它不会创建组件的新实例。

如果你将从'signin'导航到'tenant /：id / signin'，那么angular将使用它为'signin'创建的相同的SignInComponent实例。 不会调用SignInComponent的构造函数和init方法。 您可以在init方法中使用observable。 ActivatedRoute的params方法是可观察的。 您可以执行以下操作来提取参数：

route是你的ActivatedRoute实例

ngOnInit() {
  this.route.params
    .switchMap((params: Params) => this.service.getHero(+params['id']))
    .subscribe((hero: Hero) => this.hero = hero);
}

switchMap运算符允许您使用Observable的当前值执行操作，并将其映射到新的Observable。 此代码获取具有在来自服务的路由中指定的id的英雄。 你可以做这样的事情。 如果您要发布代码，那么我可以告诉您具体需要做什么。