typescriptangular5

Angular 5 role based routing

I've a website with a home page defined in my routing module as:

const appRoutes: Routes = [
{
  path: '',
  component: HomeComponent
}];

Now I would like to display a different home page for admin users (a Dashboard page). Could I change the "component" called based on the user's role?

in pseudo code something like:

const appRoutes: Routes = [
{
  path: '',
  IF UserRole = 'Admin'
     component: DashboardComponent
  ELSE
     component: HomeComponent
}];
Solution

  • To do that there is something called Angular Guards Route https://medium.com/@ryanchenkie_40935/angular-authentication-using-route-guards-bf7a4ca13ae3