Route Configuration in Angular

From the Angular cheat sheet · Routing · verified Jul 2026

Route Configuration

Setting up routes and navigation

typescript
// Basic routes
const routes: Routes = [
  { path: '', component: HomeComponent },
  { path: 'about', component: AboutComponent },
  { path: 'users/:id', component: UserComponent },
  { path: '**', component: NotFoundComponent }
];

@NgModule({
  imports: [RouterModule.forRoot(routes)],
  exports: [RouterModule]
})
export class AppRoutingModule { }

// Router outlet in template
<router-outlet></router-outlet>

// Router links
<a routerLink="/about">About</a>
<a [routerLink]="['/users', userId]">User Profile</a>
💡 Use lazy loading for large feature modules
⚡ PreloadAllModules strategy improves perceived performance
📌 Order matters - wildcard route must be last
🔥 Use routerLinkActive for navigation highlighting

More Angular tasks

Back to the full Angular cheat sheet