如何在Angular 4中处理重复的HTML代码，例如页眉和页脚？

Question

在我的Angular Web项目中，我在Angular 4项目的许多页面中使用了不同的两种或三种类型的标题。 有没有一种方法可以只对HTML标题代码和页脚代码进行一次编码，并将其包含或注入到您的一个或多个页面中。 为了提供一些线索，我需要在每个页面中为ASP.NET MVC Razor witch中的@Section提供替代方案，我们可以向其中添加一个额外的代码（我知道这是服务器端的事情，但是我需要在有角度的客户端端使用）。 有官方/推荐的方法吗？

Answer 1

您应该为此创建组件。 就像是：

@Component({
    selector: 'myheader',
    templateUrl: './header.component.html',
    styleUrls: ['./header.component.scss']
})
export class HeaderComponent implements OnInit {
...

然后将其添加到要使用它的其他页面的模板中（如果需要，则将其添加到app.component.html中）。 就像是：

  <myheader></myheader>

如果根据所使用的组件在标题上需要不同的数据，则只需创建HeaderService，然后通过组件将数据从组件传递到标题。