select top item with ion-infinite-scroll in ionic framework

Question

I have

 <ion-content bg-dark class="has-subheader has-footer has-tabs"> <div class="list active"> <div class="item item-divider" ng-repeat="item in controller.list" align="center" > <h2 class="default" ng-click="controller.load(item.a,item.b)" ng-class="{'selected':item.b==controller.b}" align="center">{{item.b}}</h2> </div> </div> <ion-infinite-scroll ng-if="!controller.noMoreItemsAvailable" on-infinite="controller.load()" distance="5%"></ion-infinite-scroll> </ion-content> 

and my .css file is

 .selected{ color:black !important; } .default{ color:#7b7a7a; } 

i need to select the third item from the top when i scroll and make that item as active and also i need to know how to get that item in controller

i tried using

$ionicScrollDelegate.getScrollPosition().top;

but its not working!!!

the above image shows what i needed when scrolling.

Answer 1

You will have to select it when the list loads, saving it in your scope variable listenCtrl.b .

And maybe you are not calling your scope correctly in that case, I'm guessing you are using controllerAs and accessing the scope with controller. , but in the ng-class you access to listenCtrl instead. Probably you have to use controller as well.