Search code examples
ionic-frameworkvirtualscroll

Ionic - Scroll to a particular element Virtual Scroll

i have the following code.

home.html:

<ion-list [virtualScroll]="newDates" approxItemHeight="50px">
<ion-item *virtualItem="let date" id="i">
{{date.holiday}}
</ion-item>
</ion-list>

home.ts:

scrollTo(){
let yOffset = document.getElementById('25').offsetTop;
this.content.scrollTo(0, yOffset);
}

For Example i have to scroll down to i=25

The following method works for normal list without VirtualScroll.

VirtualScroll doesnt display the elements which are not seen on the view hence we get an error yOffset is null

Solution

  • The virtual scroll component that the ionic contains is a very strange and bug-filled component. In an app I've even developed I tried to use it, but I ended up preferring to use angular2-virtual-scroll. I think you could try this component instead of the current one you are using.