Ionic 3 - 打开应用程序时如何重定向 roottab
Ionic 3 - How to redirect roottab when opening app
我是 angular 和 ionic 的新手,我有一个问题让我很生气。我确信解决方案很简单,但经过大量搜索和尝试后我没有找到我的解决方案。
我使用 Ionic 3 开发了一个应用程序,并使用 phonegap 推送插件来处理苹果通知。
我的应用程序使用选项卡模板,当我收到通知时,我想打开第 3 个选项卡而不是默认的第 1 个选项卡。
我尝试了 push 方法和 setRoot 方法但是除了崩溃之外没有任何追加。
在那之后,为了确保使用正确的方式,我只尝试在第三个选项卡上打开应用程序,仅此而已,只是崩溃。我似乎在使用@ViewChild 时遇到了问题。
tabs.ts
import { SettingsPage } from './../settings/settings';
import { NewsPage } from './../news/news';
import { Component, ViewChild } from '@angular/core';
import { AboutPage } from '../about/about';
import { TableauDeBordPage } from '../tableau-de-bord/tableau-de-bord';
import { HomePage } from '../home/home';
import { Tabs } from '../../../node_modules/ionic-angular/umd';
@Component({
templateUrl: 'tabs.html'
})
export class TabsPage {
@ViewChild('myTabs') tabRef: Tabs;
tab1Root = HomePage;
tab2Root = TableauDeBordPage;
tab3Root = NewsPage;
tab4Root = AboutPage;
tab5Root = SettingsPage;
constructor() {
}
ionViewDidEnter(){
this.tabRef.select(2);
}
}
tabs.html
<ion-tabs #myTabs>
<ion-tab [root]="tab1Root" tabTitle="Agenda" tabIcon="ios-calendar-outline"></ion-tab>
<ion-tab [root]="tab2Root" tabTitle="Tableau de bord" tabIcon="ios-speedometer-outline"></ion-tab>
<ion-tab [root]="tab3Root" tabTitle="News" tabIcon="ios-paper-outline"></ion-tab>
<ion-tab [root]="tab4Root" tabTitle="Tuiles" tabIcon="ios-grid-outline"></ion-tab>
<ion-tab [root]="tab5Root" tabTitle="Autre" tabIcon="ios-cog-outline"></ion-tab>
</ion-tabs>
当我从 xcode 启动应用程序时,我只有崩溃和白屏。
当我从浏览器(离子服务)启动应用程序时,出现运行时错误:找不到模块“。”仅当我使用 viewchild 时才追加。
我知道我没有以正确的方式使用它,但对我来说,我和 Ionic 的文档中的一样
尝试这样的事情:
在app.component.html
import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
import { TabsPage } from '../pages/tabs/tabs';
@Component({
templateUrl: 'app.html'
})
export class MyApp {
rootPage:any = TabsPage;
constructor(platform: Platform) {
platform.ready().then(() => {
});
}
}
修复您的 Error: Cannot find module "."
.
编辑
import { Tabs } from '../../../node_modules/ionic-angular/umd';
到
import { Tabs } from 'ionic-angular';
我是 angular 和 ionic 的新手,我有一个问题让我很生气。我确信解决方案很简单,但经过大量搜索和尝试后我没有找到我的解决方案。
我使用 Ionic 3 开发了一个应用程序,并使用 phonegap 推送插件来处理苹果通知。 我的应用程序使用选项卡模板,当我收到通知时,我想打开第 3 个选项卡而不是默认的第 1 个选项卡。
我尝试了 push 方法和 setRoot 方法但是除了崩溃之外没有任何追加。 在那之后,为了确保使用正确的方式,我只尝试在第三个选项卡上打开应用程序,仅此而已,只是崩溃。我似乎在使用@ViewChild 时遇到了问题。
tabs.ts
import { SettingsPage } from './../settings/settings';
import { NewsPage } from './../news/news';
import { Component, ViewChild } from '@angular/core';
import { AboutPage } from '../about/about';
import { TableauDeBordPage } from '../tableau-de-bord/tableau-de-bord';
import { HomePage } from '../home/home';
import { Tabs } from '../../../node_modules/ionic-angular/umd';
@Component({
templateUrl: 'tabs.html'
})
export class TabsPage {
@ViewChild('myTabs') tabRef: Tabs;
tab1Root = HomePage;
tab2Root = TableauDeBordPage;
tab3Root = NewsPage;
tab4Root = AboutPage;
tab5Root = SettingsPage;
constructor() {
}
ionViewDidEnter(){
this.tabRef.select(2);
}
}
tabs.html
<ion-tabs #myTabs>
<ion-tab [root]="tab1Root" tabTitle="Agenda" tabIcon="ios-calendar-outline"></ion-tab>
<ion-tab [root]="tab2Root" tabTitle="Tableau de bord" tabIcon="ios-speedometer-outline"></ion-tab>
<ion-tab [root]="tab3Root" tabTitle="News" tabIcon="ios-paper-outline"></ion-tab>
<ion-tab [root]="tab4Root" tabTitle="Tuiles" tabIcon="ios-grid-outline"></ion-tab>
<ion-tab [root]="tab5Root" tabTitle="Autre" tabIcon="ios-cog-outline"></ion-tab>
</ion-tabs>
当我从 xcode 启动应用程序时,我只有崩溃和白屏。 当我从浏览器(离子服务)启动应用程序时,出现运行时错误:找不到模块“。”仅当我使用 viewchild 时才追加。
我知道我没有以正确的方式使用它,但对我来说,我和 Ionic 的文档中的一样
尝试这样的事情:
在app.component.html
import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
import { TabsPage } from '../pages/tabs/tabs';
@Component({
templateUrl: 'app.html'
})
export class MyApp {
rootPage:any = TabsPage;
constructor(platform: Platform) {
platform.ready().then(() => {
});
}
}
修复您的 Error: Cannot find module "."
.
编辑
import { Tabs } from '../../../node_modules/ionic-angular/umd';
到
import { Tabs } from 'ionic-angular';