I have a logout function in my app.component.ts which looks like this:
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);
}
}
and the signtout method in the auth service named authenticate
:
signOut(): Promise<void> {
return this.afAuth.auth.signOut();
}
But when I execute this function with tab menu it isn't signing out anymore I noticed when I outcomment the tab menu it is working here is the tab menu:
<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;
When I comment out the tabs, it is working probably because I have two activeNavs?
You are calling AuthPage to logOut, that's why You can not logOut and inside constructor of AuthPage You do not call a logOut function.
constructor(){
this.accountMenuItems = [
{ title: 'Logout', component: AuthPage, icon: 'log-out' },
];
}
To work your LogOut function, You can do this way. Create LogOutPage and inside the constructor call the logOut Function.
This is app.component.ts file
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
];
}
}
This is logout.ts file
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);
}
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With