一個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的英雄。 你可以做這樣的事情。 如果您要發布代碼，那么我可以告訴您具體需要做什么。