如何在运行时动态更改组件模板？ Angular 4

Question

我有一个菜单栏和操作面板。一个动作面板就是一个简单的div，我想在里面显示不同的组件。

例如： 用户点击按钮A - ＆gt;在操作面板中显示组件A; 用户点击按钮B - ＆gt;在操作面板中显示组件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>放置子状态组件。

这是一个非常好的阅读，可能会启发你： http://blog.angular-university.io/angular2-router/

Angular 2 - Submodule routing and nested <router-outlet>

可能重复