[Solved] Given this route config, what happens when navigating to '/settings'? { path: 'settings', loadComponent: () => import('./settings.component').then(m => m.SettingsComponent) } | Angular

Angular - Standalone Components

Given this route config, what happens when navigating to '/settings'?

{ path: 'settings', loadComponent: () => import('./settings.component').then(m => m.SettingsComponent) }

ASettingsComponent is loaded immediately when the app starts.

BThe SettingsComponent is loaded only when '/settings' is visited.

CAn error occurs because loadComponent is not valid here.

DThe route redirects to the root path automatically.

Step-by-Step Solution

Solution:

Step 1: Understand loadComponent behavior
loadComponent dynamically imports the component only when the route is accessed.
Step 2: Apply to '/settings' route
When navigating to '/settings', Angular loads SettingsComponent lazily at that moment.
Final Answer:
The SettingsComponent is loaded only when '/settings' is visited. -> Option B
Quick Check:
Lazy load triggers on route visit = loadComponent works [OK]

Quick Trick: loadComponent loads component only on route access [OK]

Common Mistakes:

Master "Standalone Components" in Angular

9 interactive learning modes - each teaches the same concept differently

More Angular Quizzes

Given this route config, what happens when navigating to '/settings'?