1.home.html
2. home.ts
import { Component,ViewChild } from '@angular/core';
import { NavController,Slides } from 'ionic-angular';
@Component({
selector: 'page-home',
templateUrl: 'home.html'
})
export class HomePage {
@ViewChild(Slides) slides: Slides;
index:number = 0;
constructor(public navCtrl: NavController) {
}
//添加active
goToSlide(index) {
this.slides.slideTo(index, 500);
this.addActive(index);
}
// 滑动切换
slideChanged() {
let currentIndex = this.slides.getActiveIndex();
console.log('Current index is', currentIndex);
this.addActive(currentIndex);
}
// 改变tab 颜色
addActive(index){
this.index = index;
console.log(index)
}
}
export class AppComponent { }
参考ionic3官方文档:https://ionicframework.com/docs/api/components/slides/Slides/