2016-12-07 29 views
0

これは私が達成しようとしている、私は私のプロジェクトにタブコンポーネントを追加したいが、私はページの残りの部分にログインする前にタブを表示したくない。私がやっていることは、このようなものです:ionic2のタブを非表示にするにはどうすればよいのですか?

私app.component.ts:以下

export class MyApp { 
    public rootPage: any = TabsPage; 

    constructor(platform: Platform) { 

    if (localStorage.getItem("currentUser") === null) { 
     console.log("not logged in"); 
     this.rootPage = LoginPagePage; 
    } else { 
     console.log("already logged in"); 
     this.rootPage = TabsPage; 
    } 

    platform.ready().then(() => { 
     // Okay, so the platform is ready and our plugins are available. 
     // Here you can do any higher level native things you might need. 
     StatusBar.styleDefault(); 
     Splashscreen.hide(); 
    }); 
    } 
} 

は私tabs.tsです:そして、ここ

export class TabsPage { 

    public tab1Root: any; 
    public tab2Root: any; 
    public tab3Root: any; 

    constructor() { 
    this.tab1Root = HomePage; 
    this.tab2Root = AboutPage; 
    this.tab3Root = ExplorePage; 
    } 

} 

され、私のtabs.html:

<ion-tabs> 
    <ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="home"></ion-tab> 
    <ion-tab [root]="tab2Rsoot" tabTitle="About" tabIcon="information-circle"></ion-tab> 
    <ion-tab [root]="tab3Root" tabTitle="Contact" tabIcon="contacts"></ion-tab> 
</ion-tabs> 

これを行うと、最初に読み込まれると正常に表示され、タブは表示されません。そして、私がログインした後、私は私のログイン機能で

this.navCtrl.setRoot(HomePage); 

を設定するのですが、私はすでにその横に、ログインしているときにタブが現れていない、私は「タブ」を持つようにページを更新する必要があります表示されます。それは私もログアウトするときに起こる..これを解決する方法?私は

this.navCtrl.setRoot(TabsPage,{}) 

この

答えて

2

すべてが

変更を行うには、ログイン試行の成功事例の後にこの

this.navCtrl.setRoot(Homepage,{}) 

正しいタブが私のログインページを除くすべてのページに表示したいすべてのもの正常に動作し、あなたのログインページにあなたのタブページをインポートすることを忘れないでください

+0

ありがとう、それは悪いD男!私はいつログアウトしますか? 私はすでにログインページにsetRootを設定していますが、タブはまだそこにありますか? this.navCtrl.setRoot(LoginPagePage); –

+0

http://stackoverflow.com/questions/40245759/how-to-avoid-tabs-on-footer-when-redirecting-to-next-pageこれを確認すると、私が幸せになる答えに気づくと、それがトリックになります。 –

関連する問題