angular2（2.1.1）の1つのrouterLinkで複数のアウトレットをトリガーする方法

Question

routerLink要素を選択すると、DOMの2つの別々の領域にコンポーネントを入れ替えたいと思います。 routerLinkを2 <router-outlet>にルーティングするには、それぞれ<router-outlet>に固有のコンポーネントを指定するにはどうすればよいですか。

私はこのような何かが欲しい：

<div id="region1> 
    <a routerLink="/view1" routerLinkActive="active">View 1</a> 
    <a routerLink="/view2" routerLinkActive="active">View 2</a> 

    <!-- First area to swap --> 
    <router-outlet name="sidebar"></router-outlet> 

<div> 

<div id="region2> 
    <!-- Second area to swap --> 
    <router-outlet name="mainArea"></router-outlet> 
<div>  

ルート

const routes: Routes = [ 
    { path: '', redirectTo: 'view1', pathMatch: 'full'}, 
    { path: 'view1', { 
    outlets : 
     [ 
     //one path specifies 2 components directed at 2 `router-outlets` 
     component: View1Sidebar, outlet : 'sidebar' 
     component: View1mainArea, outlet : 'mainArea' 
     ] 
    } 
    }, 
    { path: 'view2', { 
    outlets : 
     [ 
     component: View2Sidebar, outlet : 'sidebar' 
     component: View2mainArea, outlet : 'mainArea' 
     ] 
    } 
    }, 
]; 

Answer 1

あなたが求めるように、これは正確に行うことはできません。ルータの目的は、特定のページに関する情報を維持することです。

ルート情報を反映させずにコンポーネントを表示および非表示にする場合は、*ngIfディレクティブを使用します。このように使用するには、*ngIfディレクティブをトリガーするための変数をアプリケーションのどこかに置かなければなりません。

あなたは、使用にデータの任意の型を作ることができますが、ブール値に解決ブールや表現の形で*ngIf声明にそれを渡す必要があります。ここでは例として、「ある

コンポーネント

showComponentBool: boolean = true; 
showComponentStr: string = 'show'; 

HTMLで

<div *ngIf="showComponentBool"> 
    <div *ngIf="showComponentStr='show'"></div> 
</div> 

Answer 2

「@角度/コア "： "^ 4.0.0"

<a [routerLink]="[{ outlets: { primary: 'contact', aux: 'aside' }}]">Contact + Aux</a> 

https://stackoverflow.com/a/42558766/2536623