4

目前，在我的app.html文件中，我有：

<ion-tabs>
    <ion-tab [root]="tab1Root" tabTitle="Tab1" tabIcon="time"></ion-tab>
    <ion-tab [root]="tab2Root" tabTitle="Tab2" tabIcon="paper"></ion-tab>
    <ion-tab [root]="tab3Root" tabTitle="Tab3" tabIcon="more"></ion-tab>
</ion-tabs>

在我的app.js文件中，在正确导入这些页面后，我有：

    this.tab1Root = Page1;
    this.tab2Root = Page2;
    this.tab3Root = Page3;

我希望应用程序打开一个登录页面，然后从那里进入这个选项卡式视图。我不确定如何在 and 的上下文中进行逻辑app.html设置app.js

我只对涉及 Ionic 2（和 Angular 2+）的答案感兴趣，而不是旧版本。

4

2 回答 2

5

在您的应用程序中，定义以下内容：

export class YourApp {
  rootPage: Type = LoginPage;

  constructor(app: IonicApp, platform: Platform) {
    platform.ready().then(() => {

    });
  }
}

在您的 LoginPage 中，它应该具有以下内容：

export class LoginPage {
    constructor(nav: NavController) {
        this.nav = nav;
    }

    doLogin() {
        if (loginSuccessful) {
           this.nav.setRoot(YourTabsPage);
        }
    }
}
于 2016-02-20T05:57:54.350 回答
4

如果您的应用始终以登录页面打开，您应该：

1-将您的登录页面放在app.html中

2-在您的 app.js 构造函数中导入和注入NavController 。

import {NavController} from 'ionic-framework/ionic';

constructor(nav: NavController) {
    this.nav = nav;
}

3- 创建一个新的 Tabs 父组件。（您当前的 app.js ）并将其称为 TabsParentComponent 例如。

4- 在 app.js 中，一旦登录成功，调用：

this.nav.setRoot(TabsParentComponent)
于 2016-01-08T09:49:45.607 回答