ランタイム中にIonic Cordova TabRootを動的に変更する

Ionic Tabsアプリケーションを作成しました。私はtab3Root（LoginPage）上だと私は、ログイン後ランタイム中にIonic Cordova TabRootを動的に変更する

<ion-tabs> 
    <ion-tab [root]="tab1Root" tabTitle="Home" tabIcon="md-home"></ion-tab> 
    <ion-tab [root]="tab2Root" tabTitle="About" tabIcon="md-information-circle"></ion-tab> 
    <ion-tab [root]="tab3Root" tabTitle="My Account" tabIcon="md-log-in"></ion-tab> 
</ion-tabs>

とTabs.ts

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

    tab1Root = HomePage; 
    tab2Root = AboutPage; 
    tab3Root = LoginPage; 

    constructor() 
    {} 

}

私が何をしたいのかですが、私は：Tabs.htmlは

それをLoggedinPageに変更したい。他のタブの機能と通常の維持。

これは可能ですか？はいの場合どうすればいいですか？ stackblitz.com/edit/ionic-yff2sx

出典

2017-11-05 JamesAnd

はい、tsから配列からタブを作成するようにすることができます。ユーザーがログインしたときに、ログインページからタブを更新する必要があります –

正確にはどういう意味ですか？私はログイン後にtab3Root = LoggedinPageを設定しようとしましたが、それはあなたが意味するものであれば何の効果もありませんでした...私はrootが既に初期化時に設定されていたので...どのようにそれを行う上で任意のアイデア？ありがとうございました！ – JamesAnd

あなたの問題は、プロバイダで 'setRoot'を呼び出す方法です。 – Duannx

例として、それは私のコードが含まれています/編集このリンクをチェックするだけでsetRootメソッドを使用して、そのタブから他のページを呼び出す：

はあなたに

追加情報をありがとうございました。ログインページから以下のメソッドを呼び出します。

this.navCtrl.setRoot(this.loggedInPage);

Please refer this working demo

私はページにログとしてhome.tsを仮定し、ホームページからLOGGEDINページを呼んでいます。 をクリックした後、ログインしたページのホームページのボタンをクリックすると、ログインしたページのコンテンツがホームページのコンテンツを置き換えます。

出典

2017-11-08 12:51:37

ありがとう!!それは実際に動作し、私はそれを試しました、問題は私がInjectableクラスの "ログイン"機能をやっていることです。そのため私は上記の方法を使用できません。このタスクを実行するように、注入可能クラスからログインページの関数を呼び出す方法はありますか？私はInjectableクラスの外から関数を呼び出すことができません。 – JamesAnd

インジェクタブルを削除し、代わりにコンポーネントで関数を実装しました！ – JamesAnd

私はあなたが推測する注入可能なクラスとしてプロバイダを参照しています。注射可能クラスは、ビジネス検証とHTTP要求にのみ使用してください。ページ構成とページナビゲーションはコンポーネントクラスで行われるべきです。すべてのファイルと期待値で質問を編集してください。

出典

2017-11-08 16:13:45

ああよろしく！ okはチップのおかげで終わった！私はそれらをローカルのtsファイル（コンポーネント）に移動しました。（auth.user | async）このチェックは、実際のユーザログイン機能がLogInページにある間にHomePageで実行されています（存在しない場合はゲストとして表示されます）。。注射剤で私はこれを行うことができました。大丈夫です！ https://stackblitz.com – JamesAnd

https://stackblitz.com/edit/ionic-yff2sxここに私の例があります。あなたは、LoginPageのコンストラクタでユーザが認証されているかどうかを調べることができます。ホームページが認証されているかどうかを知るためには、loginpage関数をチェックする必要があります。どうもありがとう！ – JamesAnd

はいユーザーがアプリケーションを起動するたびに、ログインコンポーネントが表示され、コンストラクタでユーザーが既に認証されているかどうかを確認します。彼がすでに認証されている場合は、setRootを使用して、同じタブ内の他のページにユーザーを移動するだけです。認証前にログインページが表示されることが懸念される場合は、認証ブロックが完了するまでページを非表示にしたり、認証が完了するまで読み込みアイコンを表示したりするための条件を設定します。 –

prithivi Rajさんの回答によれば、そのページに移動できますが、タブアイコンを強調表示することはできません。

あなたはこの

this.navCtrl.parrent.select(0);

のようないくつかの事はあなたがTAB3にあり、あなたがTAB1/TAB2にナビゲートするログイン後だけのような上記のコードパラメータでインデックスを言及します考えてみてくださいしていることを行うにはINORDER this.navCtrl.parrent.select(0);/this.navCtrl.parrent.select(1); `this.navCtrl.setRoot（this。loggedInPage"）;を使用すると、そのタブに移動します。タブをハイライトしないので、タブがアクティブになっているユーザーの混乱を招くことになります。

出典

2017-11-14 12:17:41

ランタイム中にIonic Cordova TabRootを動的に変更する

答えて

関連する問題