Render lag in scrollView used in a modal


#1

Hi,

We are having some issues with trivial stuff that worked fine in earlier versions of Ionic, but now appears buggy. In a modal we place a toggle, which is bound to the view model via scope. If the switch is true we show some additional content, if it is false we hide it.

Now, the first time the modal is opened and the switch is toggled, the hidden content remains hidden. Only when we scroll the view slightly, the content is shown.

If we close the modal, then re-open it and repeat the procedure it works as expected.

I recorded a video of this: video on Google Drive
(recorded iOS emulator, but the issue also appears on iPhones and desktop Safari browsers as well, but not on Chrome or Android)

I’m not sure if this is a bug in Ionic, Angular or our code, but we started experiencing this issue first when updating from Ionic v1.0.0-beta.13 to 1.0.0 (and still same error in 1.1.0).

Any ideas what might be wrong?

We tried using resize() of $ionicScrollDelegate with a delegate-handle tied to the modal’s view… didn’t help.

Many thanks


#2

maybe you can share some code?

looks like your data gets not updated like angular does not notice the changes… only in the next $digest it gets refreshed.


#3

Thanks, yes we suspect some $digest quirks as well. Sure, here’s the code:

The directive that creates the modal (slightly stripped down)
The modal template


#4

Eureka! Setting overflow-scroll="true" on ion-content inside the modal solves the issue.

I have no idea why. What do you guys think?

We didn’t need to set this in earlier versions for it to work flawlessly.