Angularfire auth signout method isn't working after implementing tabmenu

Ionic Framework ionic-v3
1

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();
    }
}

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;

Could someone help me out and clear out why this is happening? What I allready tried is setting the root after the promise returned.

2