Encontré un error en mi código que permite sí, hacer scroll infinito pero no actualiza los datos, por lo que se muestran los mismos datos una y otra vez, no sé cómo solucionarlo, estoy usando la última versión de Angular, agradecería que alguno de ellos tenga un tip o en su defecto la solución. Mi código de desplazamiento es el siguiente (resalto que estoy usando la dependencia "ngx infinite scroll")
Componente ¨
@HostListener('window:scroll', []) onWindowScroll(): void { const yOffSet = window.pageYOffset; if ( (yOffSet || this.document.documentElement.scrollTop || this.document.body.scrollTop) > this.showScrollHeight ) { this.showButtonGoUp = true; } else if ( this.showButtonGoUp && (yOffSet || this.document.documentElement.scrollTop || this.document.body.scrollTop) < this.hideScrollHeight ) { this.showButtonGoUp = false; } } onScrollDown():void{ if (this.info.next) { console.log(this.pageNum) this.pageNum++; console.log(this.pageNum) //Prueba 1 scroll inifnito this.getDataFromService(); } } onScrollTop(): void { this.document.body.scrollTop = 0; //Para navegador Safari this.document.documentElement.scrollTop = 0; //Para el resto de navegadores }Todo está correctamente importado, no te muestro el componente completo para ahorrar espacio. Este es el HTML:
<div class="row" infinite-scroll (scrolled)="onScrollDown()"> <div class="col-xs-12 col-sm-6 col-md-3" *ngFor="let character of characters"> <app-character [character]="character"></app-character> </div> <div class="col-xs-12 col-sm-12 col-md-12 mt-5 container-notFound" *ngIf="characters.length <= 0" > <p>No hay resultados de búsqueda...</p> </div> </div> <button [ngClass]="'no-hidden'" *ngIf="showButtonGoUp" clas="btn btn-dark" (click)="onScrollTop"> Ir al principio </button>