Router

Router Configuration

References: https://angular.io/guide/router

Configure routers in src/router.js

src/app/app-routing.module.ts
const routes: Routes = [
{
path: '',
redirectTo: 'dashboard/alpha',
pathMatch: 'full',
},
{
path: '',
component: LayoutMainComponent,
children: [
{
path: 'dashboard',
canActivate: [AuthGuard],
loadChildren: () =>
import('src/app/pages/dashboard/dashboard.module').then(m => m.DashboardModule),
},
...
],
},
]

History Mode (removing /#/ hash from Url)

Don't forget configure rewrites on your server. Read more: https://router.vuejs.org/guide/essentials/history-mode.html (from vue docs)

Set useHash: false in src/app/app-routing.module.ts

src/app/app-routing.module.ts
RouterModule.forRoot(routes, {
useHash: true,
preloadingStrategy: AppPreloader,
}),

Routes Guard

Simple routes guard path src/app/components/{templateName}/layout/Guard/auth.guard.ts.

This component simply return true or false in case if user logged in or not. In our case User will be redirected to Login page if he is not logged in.

Details: https://angular.io/guide/router