滚动内容中的问题

Question

I need to implement following functionality:

<ion-content scroll="true"><div class="parent">
    <form><div class="dropdown" dropdown-select="Options"
                dropdown-model="Selected"
                dropdown-item-label="text"
                dropdown-onchange="onChange(selected)"></div>
            </div></form>
</div></ion-content>

This functionality is working fine on Android, user can scroll the whole screen also, since the form is big. And also network dropdown is scrollable. But on iOS devices network dropdown scroll is not working, user can only scroll the ion-content, but not able to scroll the dropdown options.

I tried few workarounds using $ionScrollDelegate , still no luck. Any help would be much appreciated.

Answer 1

If you want the content to be scrollable, you need to use the ion-scroll directive again instead of ion-content.

Additionally, the toggle button you have is not visible when you change ion-content to ion-scroll because it is behind the sub-header.

Alternatively, you could use:

<ion-content overflow-scroll="true">
</ion-content>

Alternatively I found this HERE could help you out

Answer 2

<ion-content scroll="true">
<div class="parent">
<form>
<ion-scroll direction="y">
<div class="dropdown" dropdown-select="Options"
            dropdown-model="Selected"
            dropdown-item-label="text"
            dropdown-onchange="onChange(selected)"></div>
</div>
<ion-scroll>
</form>
</div>
</ion-content>

try to use ion-scroll directive and see if works out for you.

Answer 3

I had the same problem, I realize that I was forcing the config to use android as platform then I got the issue. In my case the culprit was

.config(function () { ionic.Platform.setPlatform('android'); })

I remove the config and fix the problem, I can do it as this config is not needed.