如果ng-content具有内容或空Angular2

Question

I am trying to understand how to create an if to show when a ng-content is empty.

<div #contentWrapper [hidden]="isOpen">
    <ng-content ></ng-content>
</div>

<span *ngIf="contentWrapper.childNodes.length == 0">
    <p>Display this if ng-content is empty!</p>
</span>

I've tried to use that one to show a display data when the content is empty but even if the information is empty doesn't show the <span> tag

Thanks, always grateful for your help.

Answer 1

Use children instead of childNodes . Angular creates comment nodes for *ngIf* which are counted by childNodes`

<div #contentWrapper [hidden]="isOpen">
    <ng-content ></ng-content>
</div>

<span *ngIf="contentWrapper.children.length == 0">
    <p>Display this if ng-content is empty!</p>
</span>  

Plunker example