在Ionic 2上显示带有if语句的其他选项卡 [英] Showing a different tab with an if statement on Ionic 2

查看:92
本文介绍了在Ionic 2上显示带有if语句的其他选项卡的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

Ionic 2似乎与1完全不同.我使用了入门项目,这些是我的文件:

Ionic 2 seems very different from 1. I used the starter project and those are my files:

Tabs.html

Tabs.html

<ion-tabs>
  <ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="home"></ion-tab>
</ion-tabs>

Tabs.ts

import { Component } from '@angular/core';

import { SigninPage } from '../Auth/Signin/Signin';

@Component({
  templateUrl: 'Tabs.html'
})
export class TabsPage {

  tab1Root: any = SigninPage;

  constructor() {

  }
}

app.components.ts

app.components.ts

import { Component } from '@angular/core';
import { Platform } from 'ionic-angular';
import { StatusBar } from 'ionic-native';

import { TabsPage } from '../pages/Tabs/Tabs';

@Component({
    template: `<ion-nav [root]="rootPage"></ion-nav>`
})
export class MyApp {
    rootPage = TabsPage;

    constructor(platform: Platform) {
        platform.ready().then(() => {
            StatusBar.styleDefault();
        });
    }
}

是否可以通过if条件显示其他选项卡?例如,我想根据if块显示Tabs.App.htmlTabs.Auth.html.

Is there any way to show a different tab with an if condition? For example, I want to show Tabs.App.html or Tabs.Auth.html depending on an if block.

使用Ionic 2的最佳方法是什么?

What is the best way to do it with Ionic 2?

推荐答案

在ionic2中,每个页面都带有它的.ts文件.因此,如果需要2个选项卡app.htmlauth.html,则需要创建这些页面及其.ts文件.

In ionic2 every page is accompanied by it's .ts file. So if you want 2 tabs, app.html and auth.html you would need to create both these pages and their .ts file.

通过这种方式,您可以写一个if语句:

In that way you can write an if-statement saying:

if(1 > 2){
  this.rootpage = AuthTab;
}else{
  this.rootpage = AppTab;
}

ps不要忘记导入组件

这篇关于在Ionic 2上显示带有if语句的其他选项卡的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆