Если ng-контент имеет контент или пустой Angular2

Я пытаюсь понять, как создать if, если показать, когда ng-content пуст.

<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>

Я попытался использовать это, чтобы показать отображаемые данные, когда содержимое пуст, но даже если информация пуста, не отображается тег <span>

Спасибо, всегда благодарны за вашу помощь.

Ответ 1

Используйте children вместо childNodes. Angular создает узлы комментариев для *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>  

Пример плунжера