I’m migrating source code from ionic3 to ionic4.
I want to set the first page as the login.page in my new ionic4 app.
So, I wrote router.navigateByUrl in my app.component.ts.
But It’s not working.
I wrote console.log in the constructor and ionViewWillEnter of login.page.ts,
but it does not seem to be called.
Please Help me.
app.component.ts
@Component({
selector: 'app-root',
templateUrl: 'app.component.html',
providers: [CustomNativeStorage, PointsService]
})
export class MyApp {
.
.
this.router.navigateByUrl('/login');
.
app.componet.html
<ion-app>
<ion-router-outlet></ion-router-outlet>
</ion-app>
app-routing.module.ts
import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
const routes: Routes = [
{ path: '', redirectTo: 'home', pathMatch: 'full' },
{ path: 'home', loadChildren: () => import('./home/home.module').then( m => m.HomePageModule)},
{
path: 'tabs',
loadChildren: () => import('./tabs/tabs.module').then( m => m.TabsPageModule)
},
{
path: 'login',
loadChildren: () => import('./login/login.module').then( m => m.LoginPageModule)
},
login.module.ts
import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { IonicModule } from '@ionic/angular';
import { LoginPageRoutingModule } from './login-routing.module';
import { LoginPage } from './login.page';
@NgModule({
imports: [
CommonModule,
FormsModule,
IonicModule,
LoginPageRoutingModule
],
declarations: [LoginPage]
})
export class LoginPageModule {}
login-routing.module.ts
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
import { LoginPage } from './login.page';
const routes: Routes = [
{
path: '',
component: LoginPage
}
];
@NgModule({
imports: [RouterModule.forChild(routes)],
exports: [RouterModule],
})
export class LoginPageRoutingModule {}