Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

221
Views
IntersectionObserver for Infinite Scrolling > cómo seguir obteniendo más hasta que IsIntersecting sea falso

Al aprender la API de IntersectionObserver, me encuentro con un escenario (aparentemente muy básico) que no puedo entender cómo manejar, y nada de lo que he leído hasta ahora lo ha abordado.

No creo que los detalles importen aquí, creo que es algo conceptual que no entiendo, así que lo expresaré en términos genéricos.

El problema: cuando cargo por primera vez mi pantalla de desplazamiento infinito, se obtienen y representan en la pantalla un número x inicial de entradas. Todo está bien. Si mi centinela inferior todavía se cruza con la ventana gráfica después de esto, se realiza una segunda búsqueda y se agregan las nuevas entradas. Sigue bien. Sin embargo, en este punto, si mi centinela todavía se cruza con la ventana gráfica (es decir, no se han agregado suficientes entradas para empujarlo fuera de la pantalla), estoy atascado. No hay barras de desplazamiento, por lo que no puedo desplazarme hacia abajo y no se obtiene nada más. Si cambio el tamaño de la ventana de modo que el centinela desaparezca de la pantalla y luego me desplazo hacia abajo, se obtiene más.

Mi pregunta: Entonces, ¿cómo me aseguro de que en una carga inicial mi pantalla de desplazamiento infinito se "llene" con entradas y el centinela se borre de la pantalla? ¿Hay alguna manera de implementar algún tipo de lógica "while entry.IsIntersecting"?

Así es como estoy inicializando el observador (esto está en ngOnInit() de un componente Angular pero no creo que sea relevante)...

 const options = { rootMargin: '0px 0px 0px 0px' }; this.observer = new IntersectionObserver((entries) => { entries.forEach((entry) => { if (entry.isIntersecting) { this.loadMore.emit(entry); } }); }, options); this.observer.observe(this.infiniteScrollSentinal.nativeElement);

Gracias

about 4 years ago · Juan Pablo Isaza
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!