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.