Cfrgtkky

I am trying to load an Angular Module based on my role (when I am logged in). I tried it with an Angular Guard but that is not working, when it fails it does not go to the next route.

const routes: Routes = [

   {

      path: '',

      loadChildren: () => AuthModule

      // Load when not logged in

   },



   {

      path: '',

      loadChildren: () => AdminModule

      // Load when admin

   },



   {

      path: '',

      loadChildren: () => CrewModule

      // Load when crew

   }

];

Any ideas for how to fix this? I think an Angular Guard or using a matcher is not the right solution for this...

Edit: For each path/module I have my own guard looking like the following:

import { Injectable } from '@angular/core';

import { CanLoad, CanActivate, Route, Router } from '@angular/router';

import { AuthService } from '@app/core';



@Injectable()

export class AdminModuleGuard implements CanLoad {

   constructor(private authService: AuthService, private router: Router) {}



   canLoad(route: Route): boolean {

      const url: string = route.path;

      console.log('Admin Module Load Guard - Url:' + url);

      return false;

   }

}

Thanks!

Kind regrands,
Yanick

Well, I was thinking more along the lines of this:

Have different routes defined for different types of user roles:

const routes: Routes = [

  { path: '/login', loadChildren: './auth/auth.module#AuthModule' },

  { path: '/admin', loadChildren: './admin/admin.module#AdminModule' },

  { path: '/crew', loadChildren: './crew/crew.module#CrewModule' }

];

And then in your Guard Logic:

import { Injectable } from '@angular/core';

import { CanLoad, CanActivate, Route, Router } from '@angular/router';

import { AuthService } from './authentication/services/auth.service';



@Injectable()

export class AuthGuardService implements CanLoad {

  constructor(

    private authService: AuthService,

    private router: Router

  ) {}



  canLoad(route: Route): boolean {

    let url: string = route.path;

    switch(url) {

      case '/login': {

        if(this.authService.isUserLoggedIn()) {

          this.authService.userRole === 'ADMIN' ? this.router.navigate(['/admin']) : this.router.navigate(['/crew']);

          return false;

        } else {

          return true;

        }

        break;

      }

      case '/admin': {

        if(this.authService.isUserLoggedIn()) {

          if(this.authService.userRole === 'ADMIN') {

            this.router.navigate(['/admin']);

            return true;

          } else {

            this.router.navigate(['/crew']);

            return false;

          }

        } else {

          this.router.navigate(['/login']);

          return false;

        }

        break;

      }

      case '/crew': {

        if(this.authService.isUserLoggedIn()) {

          if(this.authService.userRole === 'ADMIN') {

            this.router.navigate(['/admin']);

            return false;

          } else {

            this.router.navigate(['/crew']);

            return true;

          }

        } else {

          this.router.navigate(['/login']);

          return false;

        }

        break;

      }

      default: {

        this.router.navigate(['/login']);

        return false;

        break;

      }

    }

  }



}