【Angular】当前页面元素复用

想象一下，我们有一个很大的 HTML，其中一小部分需要在不同的地方重复。一个简单的解决方案是定义一个包含重复 HTML 的容器，并在必要时引用。

当一个页面中的某一段 html 重复出现，但是体量太小没必要单独抽离组件时，可以用 ng-container 标签配合 ngTemplateOutlet 属性对目标 html 进行引用。

<!-- … -->

<ng-container *ngTemplateOutlet="tmpl; context: {text: 'Hello'}">
</ng-container>

<!-- … -->

<ng-container *ngTemplateOutlet="tmpl; context: {text: 'World'}">
</ng-container>

<!-- … -->

<ng-template #tmpl let-text="text">
  <h1>{{ text }}</h1>
</ng-template>

参考

ng-container

angular - Angular 2 中的 $implicit 是什么？