How to use the Angular Router
How to use the Angular RouterToday we will see how to use the Angular Router. The router allows us to define routes which are transformed to urls which are then understood by the browser. Having routes allows us to create different categories and access points to our website. This post will be composed by 6 parts:Define routesRouter outletSpecial routesData and ActivatedRouteResolve guardCanXXX guards1. Define routesTo start, we need to import the RouteModule and the Routes type from the Angular router.import { RouterModule, Routes } from '@angular/router';
The routes are defined via constant and then injected into the router module using either forRoot or forChild.forRoot is used to define routes on the main module and forChild is used to define routes on the child modulesFor example we can define two routes which we add to the main module:const routes: Routes = [
{
path: 'home',
component: MainPageComponent,
},
{
path: '',
redirectTo: …