0

When i use ionic slides with pager and loop true. When i swipe left from first slide, the last slide opens but the pager dots are not updated and view does not get binded to the model. If user interacts with this, then it works fine but initially the pager and view is not updated.

My html looks like this- 

    <ion-content padding>
    <div class="dummyContent">Refer to your friend and earn bonus</div>
    <ion-slides pager [loop]="true" [speed]="600">
        <ion-slide>
            <h1>{{data.team1.name}}</h1>
            <h1>{{data.team1.team}}</h1>
            <h1>{{data.team1.group}}</h1>
        </ion-slide>
        <ion-slide>
            <h1>{{data.team2.name}}</h1>
            <h1>{{data.team2.team}}</h1>
            <h1>{{data.team2.group}}</h1>
        </ion-slide>
        <ion-slide>
            <h1>{{data.team3.name}}</h1>
            <h1>{{data.team3.team}}</h1>
            <h1>{{data.team3.group}}</h1>
        </ion-slide>
    </ion-slides>
</ion-content>

and my ts file looks like this-

    import { Component, ViewChild } from '@angular/core';
    import { NavController,Slides } from 'ionic-angular';

    @Component({
    selector: 'try',
    templateUrl: 'try.html'
    })

    export class try {
    @ViewChild(Slides) slides: Slides;
    data = {
    team1: {
    name: 'mridul',
    team: 'provo',
    group: 'eagle'
    },
    team2: {
    name: 'aditya',
    team: 'toapaz',
    group: 'eagle1'
    },
    team3: {
    name: 'rajneesh',
    team: 'infinite',
    group: 'eagle2'
    }
    }

    constructor() { }
    }
mridul16
  • 1
  • 3

2 Answers2

0

I had the same issue and here is the solution that I found: You need to use slider.updateLoop(); when you want to update slides. I use them inside

   onSlideChangeEnd: function (slider) {
                $scope.slider.updateLoop();
            },

Note the you need last version of ionic1: this one works fine.

Miriam Farber
  • 18,986
  • 14
  • 61
  • 76
0
 slideOptsOne = {
    initialSlide: 0,
    slidesPerView: 1,
    autoplay: {
      disableOnInteraction: false,
      loop :true,
    },
  };

This is the new config and works like charm :) Happy coding

Divek John
  • 623
  • 8
  • 16