在 Angular 2 项目中创建布局答案

【问题标题】：Creating Layouts in Angular 2 projects在 Angular 2 项目中创建布局
【发布时间】：2017-01-18 23:51:56
【问题描述】：

您好，我正在创建一个 angular 2 的项目。我想为我的每个模块设置多个布局，例如登录布局、主页布局和每个已登录用户的用户布局。

我无法在我的项目中实现这个目标。现在我已经通过将模块分成不同的组件来为每个组件创建一个页面，这些组件将被反复使用。

谁能帮我创建一个像我们一样的布局

CakePhp

用于一次性导入所有东西，并随着路线的变化而改变一组数据。

无需登录的布局

<div> 
   <app-header-before-login> </app-header-before-login>
   <app-body> </app-body>
   <app-footer></app-footer>
</div>

登录后

<div> 
   <app-header> </app-header>
   <app-body> </app-body>
   <app-footer></app-footer>
</div>

app-body 内容将根据路由从组件中提取。我只是不想在每个组件中写这些html。

【问题讨论】：

【解决方案1】：

组件之间的切换方式有很多种：

例如使用ngSwitch 在 <app-header></app-header> 和 <app-header-before-login></app-header-before-login> 组件。
使用ViewContainerRef.createComponent()

【讨论】：