实施tabmenu后,Angularfire auth注销方法无效

时间:2018-04-08 12:23:15

标签: typescript firebase firebase-authentication ionic3

我的app.component.ts中有一个注销功能,如下所示:

export class MyApp {
    @ViewChild(Nav) nav: Nav;

    constructor(){
       this.accountMenuItems = [
          { title: 'Login', component: AuthPage, icon: 'log-in' },
          { title: 'My Account', component: MyAccountPage, icon: 'contact' },
          { title: 'Logout', component: AuthPage, icon: 'log-out' },
       ];
    }

    logOut() {
       this.authenticate.signOut();

       //THIS BELOW ISN"T NEEDED WHEN I COMMENT OUT THE TABMENU
       this.nav.setRoot(this.accountMenuItems[2].component);
    }
}

和名为authenticate

中的身份验证服务中的signtout方法
signOut(): Promise<void> {
    return this.afAuth.auth.signOut();
}

但是当我使用标签菜单执行此功能时,它不再退出了我注意到当我退出选项卡菜单时,它在这里工作的是标签菜单:

<ion-nav [root]="rootPage" main #content swipeBackEnabled="false"></ion-nav>

<ion-tabs>
    <ion-tab [root]="tab1Root" tabIcon="home"></ion-tab>
    <ion-tab [root]="tab2Root" tabIcon="search"></ion-tab>
    <ion-tab [root]="tab3Root" tabIcon="map"></ion-tab>
    <ion-tab [root]="tab4Root" tabIcon="bookmark"></ion-tab>
</ion-tabs>

tab1Root = HomePage;
tab2Root = RestaurantListPage;
tab3Root = NearbyPage;
tab4Root = FavoriteListPage;

当我注释掉标签时,它可能正常工作,因为我有两个activeNavs?

1 个答案:

答案 0 :(得分:3)

您正在将 AuthPage 调用logOut,这就是为什么您无法登录AuthPage的内部构造函数的原因您没有调用logOut函数。

constructor(){
       this.accountMenuItems = [
          { title: 'Logout', component: AuthPage, icon: 'log-out' }, 
       ];
    }

要使用LogOut功能,您可以这样做。创建 LogOutPage 并在构造函数内部调用logOut函数。

这是 app.component.ts 文件

import { LogoutPage } from '../pages/logout/logout'; //import logout Page

export class MyApp {
@ViewChild(Nav) nav: Nav;

  constructor(){
     this.accountMenuItems = [
        { title: 'Login', component: AuthPage, icon: 'log-in' },
        { title: 'My Account', component: MyAccountPage, icon: 'contact' },
        { title: 'Logout', component: LogoutPage, icon: 'log-out' }, // calling logout Page
     ];
  }
}

这是 logout.ts 文件

import { Component } from '@angular/core';
import { NavController} from 'ionic-angular';
import { LoginPage } from '../pages/login/login';

@Component({
  selector: 'page-logout',
  templateUrl: 'logout.html',
})
export class LogoutPage {

  constructor(public navCtrl: NavController) {
    //call signOut() method here using your auth provider
    this.nav.setRoot(LoginPage);
  }

}