以角度6打印嵌套的ng-template

Question

我有如下模板

<ng-template #parent>
    <ng-template #child1>
        child 1
    </ng-template>
    <ng-template #child2>
        child 2
    </ng-template>
</ng-template>

只想使用#parent打印#child 1和#child 2 任何想法吗？

Answer 1

You can use <ng-content> to project it:

parent.component.html

<div class="container">
  <h1> Parent component </h1>
  <ng-content></ng-content>
</div>

child.component.html

<h2> Child Component </h2>

app.component.html

<parent-component>
  <child-component></child-component>
</parent-component>

渲染为：

<div class="container">
  <h1> Parent component </h1>
  <h2> Child component </h2>
</div>