Dano
Dano

Reputation: 139

Ionic Collection Repeat Scroll not working

I am trying to show a list with collection repeat, it does output the list, but it's not scrollable. any idea's what I'm doing wrong?

thats my code;

<div class="list" >
    <div class="form-item"
         ng-class="{'form-item--child': airport.isChild}"
         collection-repeat="airport in airports track by airport.id"
         collection-item-width="1080"
         collection-item-height="200" ng-show="airportName && airportName.length > 0">
        <ion-radio ng-model="obj.value" ng-value="airport.value" on-tap="selectAirport(airport)">{{ airport.label }}<i class="icon-select"></i></ion-radio>
    </div>

    <div class="form-item" collection-repeat="airport in favorites track by airport.id"
         collection-item-width="1080" collection-item-height="200"  ng-hide="airportName.length > 0">
        <ion-radio ng-model="obj.value" ng-value="airport.value" on-tap="selectAirport(airport)">{{ airport.label }}<i class="icon-select"></i></ion-radio>
    </div>
</div>

Upvotes: 1

Views: 2324

Answers (1)

harksin
harksin

Reputation: 235

be sure ionic js control your scroll : overflow-scroll="false"

and wrap your item in ion-list

<ion-content class="has-header" overflow-scroll="false">
     <ion-list>
           <ion-item
               class="form-item" 
               collection-repeat="airport in favorites track by airport.id"
               collection-item-width="1080" collection-item-height="200"  ng-hide="airportName.length > 0">
               <ion-radio ng-model="obj.value" ng-value="airport.value" on-tap="selectAirport(airport)">{{ airport.label }}<i class="icon-select"></i></ion-radio>
           </ion-item>
    </ion-list>
</ion-content>

Upvotes: 6

Related Questions