Ionic-framework: Virtual Scroll only rendering 4 items after rendering empty list

[corran2go]

Ionic version: (check one with "x")
[ ] 1.x
[X ] 2.x

I'm submitting a ... (check one with "x")
[X ] bug report
[ ] feature request
[ ] support request => Please do not submit support requests here, use one of these channels: https://forum.ionicframework.com/ or http://ionicworldwide.herokuapp.com/

Current behavior:
I'm using a virtualScroll to display items which can be filtered. After the filter has returned an empty list the next attempt to render all items results in only 4 items to be rendered and added to the DOM.

Expected behavior:
Clearing a filtered virtualScroll list should always render all items.

Steps to reproduce:
I've debugged the issue and traced it to this line of code
https://github.com/driftyco/ionic/blob/master/src/components/virtual-scroll/virtual-util.ts#L78

stopAtHeight is 0 so the function returns after processedTotal reaches 4 which skips all other items in the collection

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

Cordova CLI: 6.4.0 
Ionic Framework Version: 2.0.0
Ionic CLI Version: 2.1.18
Ionic App Lib Version: 2.1.9
Ionic App Scripts Version: 1.0.0
ios-deploy version: Not installed
ios-sim version: Not installed
OS: Linux 4.4
Node Version: v6.9.4
Xcode version: Not installed

[jgw96]

Hello, thanks for using Ionic! We will look into this issue.

[mtycholaz]

@corran2go Out of curiosity, what was your debugging process to find this issue? Stepped through the un-minified code I assume?

[jgw96]

Hello everyone! I am going to close this issue as a duplicate of https://github.com/driftyco/ionic/issues/9722. Thanks for using Ionic!

[corran2go]

@jgw96 this might be related but in my case there is no way to display more than 4 items even when scrolling down. The height of the list is set correctly but additional items are not added to the DOM when scrolling.

[corran2go]

@mtycholaz right, just ionic serve and then choose the source file in DEV tools under node_modules/ionic-angluar and set your breakpoint

[JamesLeeTrigg]

having the same problem 2.0.0 final

[andrewsduarte3]

This post at ionic forum may help you guys
https://forum.ionicframework.com/t/ionic-2-virtualscroll-items-overlapping-on-first-render/89230/11 (Daveshirman answer)
I tried this out and works fine, but don't give me the performance that I was expecting... I'll try something else

[ionitron-bot[bot]]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.