How can I repeat the content (aka * ngFor) without a wrapping element?

I have an Angular 4 component that uses what is effectively a 2d array. I have an array of sections containing an array of links. I want them to be able to output them completely:

<ul>
  <div *ngFor="let section of all_sections">
    <li *ngFor="let nav of section.links" [class.active]="nav.href === current_url">
    </li>
    <li class="divider"></li>
  </div>
</ul>

How can I get it to loop, but without an extra wrapping div for partitions? It should only be li tags inside ul.

Expected Result:

<ul>
    <li class="active"></li>
    <li class="active"></li>
    <li class="active"></li>
    <li class="divider"></li>
    <li class="active"></li>
    <li class="active"></li>
    <li class="active"></li>
    <li class="divider"></li>
</ul>
+4
source share
1 answer

you can try using ng-container

<ng-container *ngFor="let section of all_sections;">
 ...
</ng-container>
+10
source

Source: https://habr.com/ru/post/1674714/


All Articles