Migrating ng-infinite-scroll to modern Angular
ng-infinite-scroll called a function when the user scrolled near the bottom of the window or of a container. It is tied to AngularJS.
What replaces it
| Option | When to choose it |
|---|---|
| ngx-infinite-scroll | Closest match: a directive that emits an event when the user scrolls near the end. |
| IntersectionObserver in a small directive | No dependency: observe a sentinel element placed at the end of the list. |
| CDK virtual scroll | When the list gets long enough that rendering every row is the real problem. |
How to migrate it
- Check each list: window scroll or a scrolling container, the distance threshold and the disabled flag.
- Move page loading to a service that tracks the current page, a loading flag and whether more data exists.
- Attach the new directive or observer and render the list with @for and a track expression.
Watch out. Guard against duplicate loads: the trigger fires again before the previous page arrives. Ignore it while a request is pending.
Other libraries
Planning a migration or a micro-frontend platform?
In a 20-minute call you describe your situation and I tell you how I'd approach it. If it isn't worth doing yet, I'll say so.
Message me on LinkedIn