angularangular-ng-if

How can I hide the parent elements when there is no child element

For example:

<ul *ngIf="hasAnyPermission(['A:READ', 'B:READ', ...]）">
    <li *ngIf="hayPermission('A:READ')"> a </li>
    <li *ngIf="hasPermission('B:READ')"> b </li>
    ...
</ul>

In this case, I have to write all the permissions in the header again, e.g. hasAnyPermission([...]). Is it possible to write something like *ngIf="ShowOnlyWhenChildElementsAreNotEmpty()" in the header.

Solution

  • You can use .css empty

    ul:empty {
    display:none;
}