以下是我正在处理的代码
onTabsChange(abc) {
let selected_tab = this.tabs.getSelected();
let tab_index = selected_tab.index;
console.log(tab_index); // should print current tab index but it prints previously selected tab index
}
以下是Html代码
<ion-tabs #myTabs class="menu" (ionChange)="onTabsChange()" selectedIndex="0">
<ion-tab [root]="blank" tabTitle="Blank"></ion-tab>
<ion-tab [root]="blank" tabTitle="Blank"></ion-tab>
<ion-tab [root]="blank" tabTitle="Blank"></ion-tab>
<ion-tab [root]="blank" tabTitle="Blank"></ion-tab>
<ion-tab [root]="blank" tabTitle="Blank"></ion-tab>
<ion-tab [root]="blank" tabTitle="Blank"></ion-tab>
<ion-tab [root]="blank" tabTitle="Blank"></ion-tab>
</ion-tabs>
现在如果我点击任何标签,this.tabs.getSelected()会给我以前选中的标签..
如果我想要当前选中的标签,我该如何实现这一目标..
答案 0 :(得分:4)
现在如果我点击任何标签,this.tabs.getSelected()会给我 以前选择的标签..
getSelected()
方法返回选定的标签,不返回先前选择的标签。问题是索引是零基索引所以第一个选项卡的索引为0,第二个选项卡为1,依此类推......
<ion-tabs #myTabs (ionChange)="onTabsChange()" selectedIndex="0">
<ion-tab [root]="tab1Root" tabTitle="TabTitle1"></ion-tab>
<ion-tab [root]="tab2Root" tabTitle="tabTitle2"></ion-tab>
</ion-tabs>
然后在你的代码中:
@Component({
templateUrl: 'tabs.html'
})
export class TabsPage {
@ViewChild('myTabs') tabRef: Tabs;
tab1Root: any = Page1;
tab2Root: any = Page2;
public onTabsChange() {
let selectedTab = this.tabRef.getSelected();
console.log(selectedTab.index + ' - ' + selectedTab.tabTitle);
}
}