[Ionic 4] navigateRoot

I’m trying to implement a Login screen before a Home page, and I want to prevent users going back to the Login after logging in.
I’ve tried this:


But it performs the same as this this.navCtrl.navigateForward('home');, and pressing the hardware or web button I still can go back. So how can I set a root page in Ionic 4?

My routing module looks like this:

import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';

const routes: Routes = [
  { path: '', redirectTo: 'login', pathMatch: 'full' },
  { path: 'home', loadChildren: '../pages/home/home.module#HomePageModule' },
  { path: 'login', loadChildren: '../pages/login/login.module#LoginPageModule' }

  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
export class AppRoutingModule { }

I’m using NavController for navigating and Ionic 4.0.0-beta.12. Thanks in advance.

1 Like

you can use ionic Storage and add session.

Could you explain a bit more your reply about sessions?
Why NavController does not work correctly on Ionic 4?

Solved by the new Router of Angular 6



@Parga can you explain how are you using it? I’m currently handling this with this code in the Login and in my Home button for closing the app:

    // Catch back button calls and close the app
    ionViewDidEnter() {
        this.backButtonAction = this.platform.backButton.subscribe(() => {
        }, 10);

    // Unregister the custom back button action
    ionViewWillLeave() {

Then the app closes successfully.

Using the new Angular 6 Router with an option called skipLocationChange, like this!

import { Router } from '@angular/router';

    public router: Router,
    ) { }

      this.router.navigateByUrl('/dashboard', { skipLocationChange: true });

Don’t forget to add the /dashboard route to the app-routing.module.ts

{ path: 'dashboard', loadChildren: './pages/Dashboard/Dashboard.module#DashboardPageModule' },


1 Like