実行時にコンポーネントテンプレートを動的に変更する方法角度4

Question

私はメニューバーとアクションパネルを持っています。アクションパネルは、内部のさまざまなコンポーネントを表示したい単純なdivです。

例： ユーザーのクリックボタンA - >アクションパネルのコンポーネントAを表示します。 ユーザクリックボタンB - >コンポーネントBをアクションパネルに表示します。

これを行うにはどのような方法が最適ですか？

テンプレート（たとえば擬似コード）でngswtichを使用すると考えました。

<div id="action-panel"> 
    <div [ngSwitch]="componentType">   
     <div *ngSwitchCase="userComponent"> 
      <user-component></user-component> 
     </div> 
    </div> 
</div> 

Answer 1

ルーティングとサブルーティングを使用してください。 アクションパネルの内側または外側に新しい<router-outlet></router-outlet>を置き、サブ状態コンポーネントを実行します。

これは本当に良い読み物であり、あなたを啓発かもしれません：あなたは別のビューをナビゲートすることができ、これにルーティングを使用することができますAngular 2 - Submodule routing and nested <router-outlet>