ng-repeat slice prepending

@phix wrote:

Hi Everyone,

I have run into an interesting issue with the new ion-slides element regarding to prepending to an ng-repeat list. I am slicing into a large list and seeing an indexing problem causing me to skip an element when I swipe back and prepend an item. The index now references the element two away from the item that I originally swiped on. I am compensating by making a synthetic adjustment in the onSlidePrevEnd callback function. The end user can see it change, and the performance leaves something to be desired. There does not seem to be a callback available in swiper to adjust my indexing issue.

HTML:

  <ion-slides id="top" options="options" slider="data.slider" >
    <ion-slide-page ng-repeat="(key, item) in list.slice(curr.start, curr.end)">
      <div class="list card">
        <div class="item item-avatar" style="background-color: #8affb1;">
          <img src="{{item.photos[0].value}}">
          <h2>{{item.name.formatted}}</h2>
          <p>{{item.emails[0].value}}</p>
        </div>
        <ion-scroll>
          <div class="item item-body">
            <p ng-repeat="number in item.phoneNumbers">
              {{number.type}} : {{number.value}}
            </p>
          </div>
        </ion-scroll>
      </div>
    </ion-slide-page>
  </ion-slides>

Javascript:

 $scope.options = {
    loop: false,
    paginationHide: true,
    onSlideNextStart: function(swiper){
      console.log('next callback ');
      if($scope.curr.end < $scope.list.length) {
        $scope.curr.end++;
    }
  },
    onSlidePrevStart: function(swiper){
      console.log(swiper.clickedIndex);
      if($scope.curr.start > 0) {
        $scope.curr.start--;
   }
 },
   onSlidePrevEnd: function(swiper){
   swiper.slideNext(false,0);
   }
};

$scope.curr = {
start: 56,
end: 64
};

Thanks

Posts: 1

Participants: 1

Read full topic