Angular 多重转换的条件呈现

假设您有一个带有一些PanelComponent的AccordionComponent，您希望将内容投影到这些PanelComponent中：有一个

main

插槽，用于存储任何内容，还有一个

buttons

插槽，其内容投影到

div.button-bar

中

但是，仅当有任何内容要投影到

按钮

插槽中时，才应呈现

div.button-bar

是否有可能检查（在模板内）是否有一些内容要投影到特定的插槽中，并简单地使用

*ngIf

accordion.component.html

<app-panel [panelTitle]="'Panel 1'">
  <p main>I am a paragraph and I have something to say</p>
  <button buttons>Click</button>
</app-panel>

<app-panel [panelTitle]="'Panel 2'">
  <p main>I am a paragraph as well, but I'm too cool for a button.</p>
  </app-panel>
<app-panel [panelTitle]="'Panel 3'"></app-panel>

<header>
  <h3>{{ title }}</h3>
</header>

<div class="content">

  <ng-content select="[main]"></ng-content>

  <div class="button-bar">
    <ng-content select="[buttons]"></ng-content>
  </div>

</div>

提示：