Firebase 更改根页面

我是爱奥尼亚的新手，我在尝试在爱奥尼亚3上推一个根页面时遇到了问题

在app.component.ts上

import { Component } from '@angular/core';
import { LoginPage } from '../pages/login/login';
import { LoggedinPage } from '../pages/loggedin/loggedin';
import firebase from 'firebase';

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

rootPage: any;

 var state = firebase.auth().onAuthStateChanged(function(user) {
  if (user) {
    this.rootPage = LoginPage;
    //console.log(this.rootPage);
    //from here i can see that the this.rootpage is defined.
  } else {
    this.rootPage = LoggedinPage;
  }

   console.log(this.rootPage);
   //the rootpage is not defined outside of the funtion
});
 }

  initializeApp() {
    this.platform.ready().then(() => {

      this.rootPage = localStorage.getItem('userData') ? MyDashboardPage : LoginPage;
    });
  }

从'@angular/core'导入{Component}；
从“../pages/login/login”导入{LoginPage}；
从“../pages/loggedin/loggedin”导入{LoggedinPage}；
从“firebase”导入firebase；
@组成部分({
模板：``
})
导出类MyApp{
根页面：任何；
var state=firebase.auth（）.onAuthStateChanged（函数（用户）{
如果（用户）{
this.rootPage=LoginPage；
//console.log（this.rootPage）；
//从这里我可以看到this.rootpage已定义。
}否则{
this.rootPage=LoggedinPage；
}
console.log（this.rootPage）；
//根页面未在函数外部定义
});
}

我想做的是，将已经登录的用户重定向到loggedin页面。

在app.component.ts中

import { Component } from '@angular/core';
import { LoginPage } from '../pages/login/login';
import { LoggedinPage } from '../pages/loggedin/loggedin';
import firebase from 'firebase';

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

rootPage: any;

 var state = firebase.auth().onAuthStateChanged(function(user) {
  if (user) {
    this.rootPage = LoginPage;
    //console.log(this.rootPage);
    //from here i can see that the this.rootpage is defined.
  } else {
    this.rootPage = LoggedinPage;
  }

   console.log(this.rootPage);
   //the rootpage is not defined outside of the funtion
});
 }

  initializeApp() {
    this.platform.ready().then(() => {

      this.rootPage = localStorage.getItem('userData') ? MyDashboardPage : LoginPage;
    });
  }

rootPage:any

是错误的，您可以使用

rootPage:any='targetPage'

如果使用menu
rootPage:any='menuPage'
并在menuPage.ts中选择rootPage

export class MenuPage {

  rootPage = 'targetPage';

需要按以下方式更改代码：

从'@angular/core'导入{Component，ViewChild}；
从“离子角度”导入{Nav}；
从“../pages/login/login”导入{LoginPage}；
从“../pages/loggedin/loggedin”导入{LoggedinPage}；
从“firebase”导入firebase；
@组成部分({
模板：``
})
导出类MyApp{
根页面：任何；
@ViewChild（导航）导航：导航；
var state=firebase.auth（）.onAuthStateChanged（函数（用户）{
如果（用户）{
this.nav.setRoot（LoginPage）；
//console.log（this.rootPage）；
//从这里我可以看到this.rootpage已定义。
}否则{
this.nav.setRoot（LoggedinPage）；
}
console.log（this.rootPage）；
//根页面未在函数外部定义
});
}
您应该在登录后设置用户数据，并在注销时清除。在设置rootPage时，您可以检查userdata是否存在。关于app.component.ts的初始化app函数

import { Component } from '@angular/core';
import { LoginPage } from '../pages/login/login';
import { LoggedinPage } from '../pages/loggedin/loggedin';
import firebase from 'firebase';

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

rootPage: any;

 var state = firebase.auth().onAuthStateChanged(function(user) {
  if (user) {
    this.rootPage = LoginPage;
    //console.log(this.rootPage);
    //from here i can see that the this.rootpage is defined.
  } else {
    this.rootPage = LoggedinPage;
  }

   console.log(this.rootPage);
   //the rootpage is not defined outside of the funtion
});
 }

  initializeApp() {
    this.platform.ready().then(() => {

      this.rootPage = localStorage.getItem('userData') ? MyDashboardPage : LoginPage;
    });
  }

检查我的答案。。。