离子选项卡应用程序与SETROOT和PUSH有问题

Question

我有一个离子选项卡应用程序，其视图有问题。除了4个选项卡外，我还有几个生成的页面用于登录，注册，更新配置文件和addtodo。我有

rootPage:any = 'LoginPage'; 

在app.component.ts中，然后单击登录中的login（）函数。

await this.navCtrl.setRoot(TabsPage);

用户登录并带到TabSpage一旦URL为：http：//localhost：8100/＃/login

从这里开始，一切正常。我有一个签名（）函数：

 signOut(){
  this.afAuth.auth.signOut().then(res => {
  this.navCtrl.push(LoginPage);
 });
 }

这会符合用户的签名，但是由于标签仍显示在底部，所以我使用了

 window.location.reload()

刷新页面，然后看起来都正确。

当用户单击主页上的"更新配置文件"按钮时，此问题就会出现，该按钮使用此功能

    updateProfile(){
    this.navCtrl.push('ProfilePage');
    }

将用户发送到http：//localhost：8100/＃/home/profile可以在其中更新其配置文件。然后，当您返回主页时，URL仍为http：//localhost：8100/＃/home/profile，当触发''signout（）函数时，您将被带到http：//localhost：8100/＃/profile and profile及其出于某种原因，以setroot视图显示。

主要是，我正在寻找一种覆盖所有这些的方法并做到这一点，以便当签名（）函数触发时，它只需将用户返回到rootpage，即'loginPage'。

。

我对句子和语法错误的运行表示歉意。

Answer 1

在app.component.ts文件中添加此代码。您还必须将firebase和angularFire2/auth导入app.component.ts文件。

   import { AngularFireAuth } from 'angularfire2/auth';
   import * as firebase from 'firebase';

        firebase.auth().onAuthStateChanged(user => {
            if (user) {
                this.rootPage = ProfilePage
            } else {
                this.rootPage = LoginPage
            }
        })

https://firebase.google.com/docs/reference/js/firebase.auth.auth.auth.auth#onouthstatatechanged

onauthstatatechanged是一个观察者，每次用户登录或登录时都会触发。

Answer 2

您可以导入app.component.ts页面以获取rootpage。因此，您可以这样做：

import {appName} from '../../app/app.component';
 ...
 constructor(private app: appName) {}
 clickNewPage(newPage: string) {
   this.app.rootPage = newPage;
}