Angular 2，Routing，多主布局

Question

我有一个关于如何在angular2中使用多个主布局的问题。

例如：我的网站有2个部分，第一部分是前端（用户可以看到，它有自己的主布局，其网址为http://mywebsite.com/..。）

它还有一个管理部分（这个部分有自己独立的布局，其网址为http://mywebsite.com/admin/..。）

现在问题是如果在app.ts文件中我定义了页面的路由和模板，如：

<div>
    <router-outlet></router-outlet>
</div>

然后我必须将每个布局相关的组件放在每个后续的子组件中（http://mywebsite.com/products）

<my-nav></my-nav>
<my-sidebar></my-sidebar>
<div class="content">
    <!-- actual content of this component -->
</div>
<footer></footer>

再次为http://mywebsite.com/customers，同样的HTML标记。

然后我又需要一个

<my-admin-nav></my-admin-nav>
 ...

再次进行管理布局。

基本上我的问题是我怎么能过来这个？或者我可能认为完全错了，请指导我一个更好的方向。感谢

Answer 1

有多种方法可以在组件之间切换：

1）使用ngSwitch在<my-nav></my-nav>和<my-admin-nav></my-admin-nav>组件之间切换。 文档：https://angular.io/docs/ts/latest/api/common/NgSwitch-directive.html

2）使用ViewContainerRef.createComponent()