Angular 2+で複数のルートを一度に有効にする

Question

名前付きルーターアウトレット内に2つの子ルートを同時に開こうとしています。これにより、私はrouter outlet Aに常にコンテンツ固有のコンポーネントで埋められるようになります。 login。

第2のrouter outlet Bは、ルート構成で与えられたdata {...}を処理する再利用可能なコンポーネントを持ちます。 （それでも特定のルートに依存します）。

これは、その経路/loginレイアウトフレームとしてFrameComponentを使用して、router outlet control-stripにrouter outlet view一つに一つのコンポーネントをロードする必要が意味します。

マイFrameComponentのレイアウトは現在、次のようになります。

<router-outlet name="view"></router-outlet> 
<router-outlet name="control-strip"></router-outlet> 

と私のルータの設定は次のようになります。

... 
{ 
    path: 'login', 
    component: FrameComponent, 
    canActivate: [ UIGuard, hasInternetConnection, authLoggedOutService ], 
    data: { 
     navigationBack: true 
    }, 
    children: [ 
     { 
      path: '**', 
      component: LoginEmailComponent, 
      outlet: 'view' 
     }, 
     { 
      path: '**', 
      component: ControlStripComponent, 
      outlet: 'control-strip' 
     } 
    ] 
}, 
... 

私が直面してる問題は、ルータの設定がオンに停止していることです最初のヒットであるため、/login/**がtrueで、ControlStripComponentは決してタッチされません。

Answer 1

子ルートの概念を第2（または補助）ルートのコンセプトと混ざっているようです。ここでセカンダリルートを使用する必要があり、ではなく、子ルートであるのようです。

これは、あなたが補助ルートにナビゲートするために必要な構文は次のとおりです。

this.router.navigate([{outlets: { popup: ['messages']}}]); 

または、一度に2つの補助ルートにナビゲートする：

設定は次のようなものになります

this.router.navigate([{outlets: { view: ['routeA'], control-strip: ['routeB']}}]); 

：

を