在Ionic 2上显示带有if语句的其他选项卡 [英] Showing a different tab with an if statement on Ionic 2
问题描述
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.html
或Tabs.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.html
和auth.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屋!