Bird
0
0

You have this route config:

medium📝 Debug Q6 of 15
Angular - Routing
You have this route config:
const routes = [
  { path: 'main', component: MainComponent },
  { path: 'info', component: InfoComponent, outlet: 'side' }
];

And template:
<router-outlet></router-outlet>
<router-outlet name="side"></router-outlet>

When navigating to /main(side:info), the InfoComponent does not render. What is the likely cause?
AThe named outlet 'side' is misspelled in the template or route.
BAngular does not support multiple outlets in one template.
CThe URL syntax for named outlets is incorrect.
DInfoComponent is not declared in the module.
Step-by-Step Solution
Solution:
  1. Step 1: Check outlet name consistency

    Named outlets must have matching names in route config and template; a typo causes no rendering.
  2. Step 2: Exclude other causes

    Angular supports multiple outlets; URL syntax is correct; missing declaration causes errors but not silent failure.
  3. Final Answer:

    Named outlet 'side' is misspelled in template or route. -> Option A
  4. Quick Check:

    Outlet names must match exactly [OK]
Quick Trick: Match outlet names exactly in routes and template [OK]
Common Mistakes:
MISTAKES
  • Assuming Angular disallows multiple outlets
  • Miswriting URL syntax for named outlets
  • Ignoring component declarations in module

Want More Practice?

15+ quiz questions · All difficulty levels · Free

Free Signup - Practice All Questions
More Angular Quizzes