导航到Ionic 3中的特定选项卡

Question

单击按钮时，我在选择选项卡的索引时遇到问题。我在android-tutorial.ts中这样调用索引，但它不起作用。

我正在调用android-tutorial.ts中的函数，函数为startApp((；

还有别的办法吗？我做错了什么？希望你能帮助我！

• 选项卡page.ts

mySelectedIndex: number = 0;
tabs: Tab[] = [
{
page: "NoveltiesPage",
icon: "icon-novelties"
},
{
page: "BrandsPage",
icon: "icon-menus"
},
{
page: "LoginPage",
icon: "icon-user"
},
{
page: "StoresPage",
icon: "icon-stores"
},
{
page: "AboutPage",
icon: "custom-hat"
}
];
constructor(public navCtrl: NavController, public events: Events, public alertCtrl: AlertController, public storageProvider: StorageProvider, public pushProvider: PushProvider, public aboutProvider: AboutProvider, private appVersion: AppVersion, public platform: Platform, public deviceProvider: DeviceProvider, public alertProvider: AlertProvider) {
this.platform.ready().then(() => {
this.getVersion();
//Navigate to Login Page on Startup
this.storageProvider.getUser().then((user: User) => {
if (user && user.token) {
let token = user.token;
this.events.publish("user:login", token);
this.pushProvider.start();
}
});
});
this.platform.resume.subscribe(() => {
this.getVersion();
});
this.events.subscribe("user:login", () => {
this.tabs[2].page = "AccountPage";
});
this.events.subscribe("user:logout", () => {
this.tabs[2].page = "LoginPage";
});
this.events.subscribe("user:notification", (data: any) => {
switch (data.additionalData.type) {
case "novelty":
this.events.publish("novelty:new");
this.navCtrl.push("NoveltyPage", {
id: data.additionalData.id
});
break;
// case "message":
//  this.events.publish('message:new');
//  this.navCtrl.push('MessagePage', {
//      id: data.additionalData.id,
//  });
//  break;
default:
this.events.publish("card:update");
this.alertProvider.show(data.title, data.message);
break;
}
});
}
getVersion() {
//get the version of the method
this.aboutProvider.app().subscribe((data: any) => {
this.curVersion = data.data;
//get platform of the Device
let platform = this.deviceProvider.getPlatform();
let curV: string = this.curVersion.ios;
let store: string = this.curVersion.app_ios_url;
if (platform == "Android") {
curV = this.curVersion.android;
store = this.curVersion.app_android_url;
}
//get the version of the app
this.appVersion
.getVersionNumber()
.then((data: any) => {
let version = data;
if (curV > version) {
switch (this.curVersion.status) {
case "1":
this.alertProvider.action(this.curVersion.title, this.curVersion.message, [{ text: "Cancelar" }, { text: "Atualizar", action: "link", link: store }]);
break;
case "2":
this.alertProvider.action(this.curVersion.title, this.curVersion.message, [{ text: "Atualizar", action: "link", link: store }], false);
break;
default:
break;
}
}
})
.catch(e => {});
});
}
} 

• android-tutorial.ts

import { Component, ViewChild } from '@angular/core';
import { Storage } from '@ionic/storage';
import { IonicPage, Slides, NavController, Events, NavParams } from 'ionic-angular';
@IonicPage()
@Component({
selector: 'page-android-tutorial',
templateUrl: 'android-tutorial.html',
})
export class AndroidTutorialPage {
seen: boolean;
currentIndex: number = 1;
@ViewChild('slides') slides: Slides;
constructor(public navCtrl: NavController, public navParams: NavParams, public storage: Storage, public events: Events) {
this.seen = this.navParams.data.seen;
if (!this.seen) {
this.seen = false;
}
}
startApp() {
this.navCtrl.setRoot('TabsPage', {
mySelectedIndex : 2
});
this.storage.set('hasSeenTutorial', 'true');
}
back() {
this.navCtrl.pop();
}
slideChanged() {
let index = this.slides.getActiveIndex();
if(index != 4) {
this.currentIndex = this.slides.getActiveIndex() + 1;
}
}
}

• tabs-page.html

<ion-tabs [selectedIndex]="mySelectedIndex">
<ion-tab [root]="tab.page" tabIcon="{{tab.icon}}" *ngFor="let tab of tabs"></ion-tab>
</ion-tabs> 

Answer 1

好的，我找到了一种方法。

以下是我解决问题的方法。我需要能够将索引传递到android教程中的选项卡页面。ts

这是我唯一添加的内容：

constructor(public navCtrl: NavController, public events: Events, public alertCtrl: AlertController, public storageProvider: StorageProvider, public pushProvider: PushProvider, public aboutProvider: AboutProvider, private appVersion: AppVersion, public platform: Platform, public deviceProvider: DeviceProvider, public alertProvider: AlertProvider, public params: NavParams) {
this.mySelectedIndex = this.params.get('mySelectedIndex'); <---- THIS IS THE LINE I ADDED
this.platform.ready().then(() => {
this.getVersion();
//Navigate to Login Page on Startup
this.storageProvider.getUser().then((user: User) => {
if (user && user.token) {
let token = user.token;
this.events.publish("user:login", token);
this.pushProvider.start();
}
});
});
this.platform.resume.subscribe(() => {
this.getVersion();
});
this.events.subscribe("user:login", () => {
this.tabs[2].page = "AccountPage";
});
this.events.subscribe("user:logout", () => {
this.tabs[2].page = "LoginPage";
});
this.events.subscribe("user:notification", (data: any) => {
switch (data.additionalData.type) {
case "novelty":
this.events.publish("novelty:new");
this.navCtrl.push("NoveltyPage", {
id: data.additionalData.id
});
break;
// case "message":
//  this.events.publish('message:new');
//  this.navCtrl.push('MessagePage', {
//      id: data.additionalData.id,
//  });
//  break;
default:
this.events.publish("card:update");
this.alertProvider.show(data.title, data.message);
break;
}
});
}