# DOM update with ngFor

**URL:** <https://forum.ionicframework.com/t/dom-update-with-ngfor/250000>\
**Category:** Ionic Angular\
**Created:** [November 19, 2025, 1:54pm UTC](https://forum.ionicframework.com/t/dom-update-with-ngfor/250000 "2025-11-19T13:54:59Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![AvinSSSS](https://avatars.discourse-cdn.com/v4/letter/a/46a35a/32.png) [@AvinSSSS](https://forum.ionicframework.com/u/AvinSSSS)\
**Post date:** [November 19, 2025, 1:54pm UTC](https://forum.ionicframework.com/t/dom-update-with-ngfor/250000/1 "2025-11-19T13:54:59Z")

</div>

Hello guys, could anyone help me with an issue i’m having on my app?  
I have this template, and when ‘itemsByDeliveryHour’ is updated the DOM goes crazy creating divs.  
I wanna render all at once after the last pass on the ngFor, or at least give the felling of it.

ng-container \*ngIf=“itemsByDeliveryHour?.length” (rendered)=“listLoaded”\>

```
<div \*ngFor="let item of itemsByDeliveryHour; let last = last; let first = first " class="items-group" \[ngClass\]="{'opened': item.opened}" >

    <ion-item-divider (click)="openGroup(item)">

      {{item.label}} <span>(<span \*ngIf="isAdminOrSeller">{{item.countWithDeliveryMan}}/</span>{{item.count}})</span>

    </ion-item-divider>

    <div \*ngFor="let itemI of item.itemsByDeliveryArea" class="items-group" \[ngClass\]="{'opened': itemI.opened}">

      <ion-item-divider (click)="openGroupDelivery(itemI)">

        {{itemI.label}} <span>(<span

            \*ngIf="isAdminOrSeller">{{itemI.countWithDeliveryMan}}/</span>{{itemI.count}})</span>

      </ion-item-divider>

      <adm-dispatch-list-item \[items\]="itemI.items" \[searchTerm\]="searchText" \[user\]="user" \[store\]="store"

        \[dispatchFilter\]="dispatchFilter" (listItemUpdated)="listItemUpdated()"></adm-dispatch-list-item>

    </div>

    <hr>

  <div \*ngIf="last">

    <ng-container \*ngIf="onRenderComplete(true)"></ng-container>

  </div>

</div>

<hr>

```

---

<div class="post-metadata">

**Author:** ![AvinSSSS](https://avatars.discourse-cdn.com/v4/letter/a/46a35a/32.png) [@AvinSSSS](https://forum.ionicframework.com/u/AvinSSSS)\
**Post date:** [November 21, 2025, 5:50pm UTC](https://forum.ionicframework.com/t/dom-update-with-ngfor/250000/2 "2025-11-21T17:50:29Z")

</div>

1. the main problem was the nested ngFor, i put trackby on all them who is part of it and also make a comparison to not update the list if the new and the old the are the same

2. now its better, it’s not the same as before on ionic 3 but is bearable