бесконечная прокрутка: список массивов не отображается в * ngFor после добавления элемента в массив в конце прокрутки

Question

Я отображаю массив списка, используя ngFor. я использую бесконечную прокрутку и добавляю новые элементы в конце прокрутки. но после добавления новых элементов в массиве рендеринг не происходит, и он обновляется только тогда, когда я нажимаю на любой элемент страницы.

file. html

<div *ngIf="arrayList.length">
   <ul class="max-h-400" infinite-scroll (scrollEnd)="onScrollFunc()">
       <li *ngFor="let item of arrayList;let i = index">
           <div>item.name</div>
       </li>
   </ul>
</div>

file.ts

onScrollFunc() {
this.getNewElemList(reqObj)
  .subscribe(
    response => {
      if (response && response.data) {
        if (this.arrayList && this.arrayList.length) {
          this.arrayList.push(...response.data);
        } else {
          this.arrayList = response.data;
        }
      }
    },
    () => {
       console.log('error');
    }
  );

}

Answer 1

Проблема в том, что обнаружение изменений не сработает, если вы добавите массив sh. Поскольку связанный объект является массивом, массив должен изменить свою ссылку. Поэтому вместо arrayList.pu sh сделайте это так: this.arrayList = [... this.arrayList, ... response.data]. Это создает новый массив, который запускает обнаружение изменений для визуализации снова