Ionic slides move to first slide to last with loop true does not update pager

I have used ionic 2 slides in my application with loop true and pager. When I move left from first slide to last the pager is not updated and the view is not binded to model values.

try.html


<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 the try.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() { }
}

I am stuck with this for almost 10 days. Any help would be appreciated. Thanks. :slight_smile: