Lazy loading is one of the most powerful and useful concepts of Angular Routing. It makes the web pages easy to download by downloading them in chunks instead of downloading everything in a big bundle. Lazy loading facilitates asynchronously loading the feature module for routing whenever required using the property loadChildren.
See the following example where we are going to load both Employee and Order feature modules lazily.
See the example:
const routes: Routes = [
{
path: 'employees',
loadChildren: () => import('./employees/employees.module').then(module => module.EmployeesModule)
},
{
path: 'orders',
loadChildren: () => import('./orders/orders.module').then(module => module.OrdersModule)
},
{
path: '',
redirectTo: '',
pathMatch: 'full'
}
];
Submitted questions and answers are subject to review and editing, and may or may not be selected for posting, at the sole discretion of w3Sniff.
Get Started
Comments
Leave a Comment