is there a way to add a resolver before loading a lazy load module? i tried to add resolve
to the routs configuration but it is not triggered, also didn't find any thing useful about it on the web. any help would be appreciated
import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router';
// services
import {SecondResolverService} from "./second.resolver.service";
const routes: Routes = [
{ path: 'first' , loadChildren: './first/first.module#FirstModule' },
{ path: 'second', loadChildren: './second/second.module#SecondModule' ,resolve : {data : SecondResolverService}}
];
@NgModule({
imports: [RouterModule.forRoot(routes)],
exports: [RouterModule]
})
export class AppRoutingModule { }
So what is Angular Resolver? Angular Route Resolver is used for pre-fetching some of the data when the user is navigating from one route to another. It can be defined as a smooth approach for enhancing user experience by loading data before the user navigates to a particular component.
LoadChildrenlink A function that returns a set of routes to load.
Lazy loading helps to keep the bundle size small, which helps reduce load times. We must use the class decorator to create an Angular module @NgModule, and the decorator uses a metadata object that defines the module. The main properties are: import: Components of this module are used with Array with other modules.
Angular docs on lazy loading
This config always works for me. If this doesnt work there may be something wrong with your resolver.
const routes: Routes = [
{
path: 'second',
loadChildren: () => import('/second/second.module')
.then(m => m.SecondModule),
resolve: {
data: SecondResolverService
}
},
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With