首页 > 解决方案 > Promise 或然后 onAuthStateChanged 函数

问题描述

我想知道用户是否登录,然后我想等待 onAuthStateChanged 的​​回答然后我可以重定向到我的主页,因为我知道用户已登录..

我怎么能这样做?

这是我的 app.component.ts

import { Component, ViewChild } from '@angular/core';
import { Nav, Platform } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';

import { LoginPage } from '../pages/login/login';
import { HomePage } from '../pages/home/home';
import { ListPage } from '../pages/list/list';
import { WizardSignupPage } from '../pages/wizard-signup/wizard-signup';

import { FireauthServices } from '../providers/fireauth-service/fireauth-service';
import { Storage } from '@ionic/storage';

@Component({
  templateUrl: 'app.html'
})
export class MyApp {
  @ViewChild(Nav) nav: Nav;

  rootPage: any;

  pages: Array<{title: string, component: any}>;

  menuSelected: string;

  constructor(public platform: Platform, 
              public statusBar: StatusBar, 
              public splashScreen: SplashScreen,
              private fireauth: FireauthServices,
              private storage: Storage) {

    this.initializeApp();

    // used for an example of ngFor and navigation
    this.pages = [
      { title: 'Home', component: HomePage },
      { title: 'List', component: ListPage },
      { title: 'Login', component: LoginPage },
      { title: 'WizardSignup', component: WizardSignupPage }
    ];

    //this.rootPage = LoginPage;
    this.rootPage = WizardSignupPage;

  }

  initializeApp() {
    this.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.
      this.statusBar.styleDefault();
      this.splashScreen.hide();
    });

    console.log(this.fireauth.isLoggedIn());

  }

  openPage(page) {
    // Reset the content nav to have just this page
    // we wouldn't want the back button to show in this scenario
    this.nav.setRoot(page.component);
  }

  clickMenu(option){
    switch(option){
      case 'logout':
        this.nav.setRoot(LoginPage);
        break;

      default:
        break;
    }

    this.menuSelected = option;
  }
}

这是我的 fireauth-services.ts

import { HomePage } from '../../pages/home/home';

import { Nav } from 'ionic-angular';
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';

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



@Injectable()

export class FireauthServices {

  // @ViewChild(Nav) nav: Nav;
  private user: firebase.User;

  constructor(public http: HttpClient,
              public fireauth: AngularFireAuth) {

    fireauth.authState.subscribe(user => {
            this.user = user;
    });

    console.log('Hello FireauthServiceProvider Provider');
  }

  signInWithEmail(credentials) {
    console.log('Sign in with email');
    return this.fireauth.auth.signInWithEmailAndPassword(credentials.email,
       credentials.password);
  }

  signUpWithEmail(credentials) {
    console.log('Sign up with email');
    return this.fireauth.auth.createUserWithEmailAndPassword(credentials.email, credentials.password);
  }

  getCurrentUser() {
    return this.fireauth.auth.currentUser;
  }

  isLoggedIn() {

    this.fireauth.auth.onAuthStateChanged(function(user) {
      if (user) {
        // User is signed in.
        console.log(user);
        return true;
      } else {
        // No user is signed in.
        console.log('nope');
      }
    });
  }

  getUID() {
    console.log(this.user);
    return this.user.uid;
  }

}

app.component.ts 上的 console.log 返回 null ,因为我猜该函数还没有响应。

我正在考虑的另一个解决方案是从我的 fireauth-services.ts 访问 nav.setRoot,这可能吗?使用提供商的 navCtrl?

对不起,我的英语不好,顺便说一句。

标签: angulartypescriptfirebaseionic3

解决方案


推荐阅读