How to preload a component in Angular

Question

With the help of code can you tell me How to preload a component in Angular?

Answer 1

In Angular, components are not preloaded directly, but their associated modules can be preloaded using lazy loading with preloading strategies.

Using PreloadAllModules to Preload Lazy-Loaded Modules

import { NgModule } from '@angular/core';

import { RouterModule, Routes, PreloadAllModules } from '@angular/router';

const routes: Routes = [

  { path: 'dashboard', loadChildren: () => import('./dashboard.module').then(m => m.DashboardModule) }

];

@NgModule({

  imports: [RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })],

  exports: [RouterModule]

})

export class AppRoutingModule {}