In this example, the onScrollDown callback will be invoked when the window is scrolled down and the onScrollUp callback will be invoked when the window is scrolled up: import { Component } from '@angular/core'; import { InfiniteScroll } from 'ngx-infinite-scroll'; @Component({ select...
main.ts polyfills.ts styles.css angular.json package.json app.component.ts 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45
In this example, the onScrollDown callback will be invoked when the window is scrolled down and the onScrollUp callback will be invoked when the window is scrolled up: import { Component } from '@angular/core'; import { InfiniteScroll } from 'ngx-infinite-scroll'; @Component({ select...
method and the "Return API" serve as tools for normalizing App-Scroller processes. In many cases, it is crucial to perform certain logic only after the Scroller has finished its work and entered a relaxed state. Below is an example of how to safely implement a sequence of Adapter method ...
Example:<virtual-scroller #scroll [items]="items"> <my-custom-component [expanded]="item.expanded" *ngFor="let item of scroll.viewPortItems"> </my-custom-component> </virtual-scroller>If container size changesNote - This should now be auto-detected, however the 'refresh' method can still...
Example:<virtual-scroller #scroll [items]="items"> <my-custom-component [expanded]="item.expanded" *ngFor="let item of scroll.viewPortItems"> </my-custom-component> </virtual-scroller>If container size changesNote - This should now be auto-detected, however the 'refresh' method can still...
Here's an example of how to do this:<virtual-scroller #scroll [items]="myComplexItems"> <my-custom-component [myComplexItem]="complexItem" *ngFor="let complexItem of scroll.viewPortItems; trackBy: myTrackByFunction"> </my-custom-component> </virtual-scroller>...
(example: Facebook posts/etc). virtual-scroller relies on javascript APIs to measure the size of child elements and the scrollable area of their parent. These APIs do not work in SSR because the HTML/CSS "screenshot" is generated on the server via Node, it doesn't execute/render the ...
An example is if an element inside <virtual-scroller> emits a "change" event which bubbles up to the (change) handler of virtual-scroller. Using the vs prefix will prevent this bubbling conflict because there are currently no official DOM events prefixed with vs.Use parent...
Example:<virtual-scroller #scroll [items]="items"> <my-custom-component [expanded]="item.expanded" *ngFor="let item of scroll.viewPortItems"> </my-custom-component> </virtual-scroller>If container size changesNote - This should now be auto-detected, however the 'refresh' method can still...