Ion-slides with form inputs blocks page scrolling - ionic-framework

Question

I have a few form inputs inside a <ion-slide > but I can not scroll to view all fields in the slide, it prevents me from scrolling inside the slide. On a device, when there is an ion-input, the ion-list scrolling behaviour does not work.
There is also some CSS issue with the labels overlapping (See img below)... I am using Ionic v 1.3.
<ion-view scroll="true">
<ion-nav-bar class="bar-light">
<ion-nav-buttons side="left">
<button class="button button-positive button-clear no-animation"
ng-click="startApp()" ng-show="!slideIndex">
Skip
</button>
<button class="button button-positive button-clear no-animation"
ng-click="previous()" ng-show="slideIndex > 0">
Previous
</button>
</ion-nav-buttons>
<ion-nav-buttons side="right">
<button class="button button-positive button-clear no-animation"
ng-click="next()" ng-show="slideIndex != 2">
Next
</button>
<button class="button button-positive button-clear no-animation"
ng-click="startApp()" ng-show="slideIndex == 2">
Finish
</button>
</ion-nav-buttons>
</ion-nav-bar>
<ion-slide-box on-slide-changed="slideChanged(index)" scroll="true">
<ion-slide scroll="true">
<h3>Start </h3>
<div class="list">
<label class="item item-input item-stacked-label">
<span class="input-label">First Name</span>
<input type="text" placeholder="John">
</label>
<label class="item item-input item-stacked-label">
<span class="input-label">Last Name</span>
<input type="text" placeholder="Suhr">
</label>
<label class="item item-input item-stacked-label">
<span class="input-label">Email</span>
<input type="text" placeholder="john#suhr.com">
</label>
<label class="item item-input item-stacked-label">
<span class="input-label">Email (use your gym email)</span>
<input type="text" placeholder="john#suhr.com">
</label>
<label class="item item-input item-select">
<div class="input-label">
Select your Gym Location
</div>
<select>
<option>FitnFast KellyVille</option>
</select>
</label>
</div>
</ion-slide>
<ion-slide>
<h3>Using Awesome</h3>
<div id="list">
<h5>Just three steps:</h5>
<ol>
<li>Be awesome</li>
<li>Stay awesome</li>
<li>There is no step 3</li>
</ol>
</div>
</ion-slide>
<ion-slide>
<h3>Any questions?</h3>
<p>
Too bad!
</p>
</ion-slide>
</ion-slide-box>
</ion-view>

Answer 1

I had the same issue and found on the ionic forums a solution by using a ion-content inside of ion-slide and it's working for me now.
https://github.com/driftyco/ionic/issues/5297
<ion-view>
<ion-content scroll="false">
<ion-slide-box>
<ion-slide>
<ion-content>
<div class="box blue"><h1>BLUE</h1></div>
</ion-content>
</ion-slide>
<ion-slide>
<ion-content>
<div class="box yellow"><h1>YELLOW</h1></div>
</ion-content>
</ion-slide>
<ion-slide>
<ion-content>
<div class="box pink"><h1>PINK</h1></div>
</ion-content>
</ion-slide>
</ion-slide-box>
</ion-content>
</ion-view>

Answer 2

The thing that helped me in exactly the same problem was putting scrollAssist: false in my app.module.ts like so:
IonicModule.forRoot(MyApp, {
scrollAssist: false,
tabsHideOnSubPages: true
}),