app-routing.module.ts

import { AuthGuard } from './guard/auth-guard';
import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes, CanActivate } from '@angular/router';

import { AppComponent } from './app.component';
import { LoginPage } from './pages/users/login/login.page';
import { IndexPage } from './pages/home/index/index.page';

const routes: Routes = [
  
  //Rotas do Home e Sub Paginas
  {
    path: '',
    component : AppComponent,
    canActivate: [AuthGuard],
    children: [
      { path: 'home', component: IndexPage },
      { path: '', redirectTo: 'home', pathMatch: 'full' },
    ]
  },
  
  // Rotas de Login e Authentificação
  {
    path: '',
    children: [
    { path: 'login', component: LoginPage },
    ]
  },
  { path: '**', redirectTo:''},
];

@NgModule({
  imports: [
    RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
  ],
  exports: [RouterModule]
})

export class AppRoutingModule {}

auth-guard.ts

import { AuthService } from './../service/auth.service';
import { Observable } from 'rxjs';
import { Injectable } from '@angular/core';
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, Router } from '@angular/router';

@Injectable({
  providedIn: 'root'
})
export class AuthGuard implements CanActivate{

  constructor(
    private AuthService : AuthService,
    public Router : Router,
  ){}

  canActivate( 
    route: ActivatedRouteSnapshot,
    state: RouterStateSnapshot,
  ) : Observable<boolean> | boolean{
    if(this.AuthService.authUserConfirma()){
      return true;
    }
    this.Router.navigate(['login'])
    return false;
  }
}

auth-service.ts

import { environment } from './../../environments/environment';
import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';

@Injectable({
  providedIn: 'root'
})
export class AuthService {

  api_url = environment.base_url+environment.api_token;
  private userLogado: boolean = false;

  constructor(public http: HttpClient) { }

  postLogin(username, password){
    let data = {
      username: username,
      password: password
    };

    let headers = new HttpHeaders();
    headers.set('Content-Type', 'application/json');
    this.userLogado = true;
    return this.http.post(this.api_url, data);
  };

  authUserConfirma(){
    return this.userLogado;
  }

  getAuth(){
  
  }
}

login.page.ts

import { Router } from '@angular/router';
import { Storage } from '@ionic/storage';
import { AuthService } from './../../../service/auth.service';
import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-login',
  templateUrl: './login.page.html',
  styleUrls: ['./login.page.scss'],
})
export class LoginPage implements OnInit {

  username;
  password;

  constructor(
    private Storage : Storage,
    private AuthService: AuthService,
    private Router: Router,
    ) { 
  
  if(this.Storage.get('wpLoginToken')){
    this.Router.navigate(['/home'])
    }
    this.Router.navigate(['/login'])
  }

  ngOnInit() {
  
  }

  onLogin(){
    this.AuthService.postLogin(this.username, this.password).subscribe(data =>{
      console.log(data);
      if(this.Storage.set('wpLoginToken', data)){
      this.Router.navigate(['/home'])
      }
      this.Router.navigate(['/login'])
    });
  }
}