Route parameters with ActivatedRoute in Angular - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is the purpose of ActivatedRoute in Angular routing?

ActivatedRoute lets you access information about the current route, including parameters, query parameters, and route data.

beginner

How do you access a route parameter named id using ActivatedRoute?

You use this.route.snapshot.paramMap.get('id') or subscribe to this.route.paramMap to get the id parameter.

intermediate

Why might you prefer subscribing to paramMap over using snapshot.paramMap?

Subscribing to paramMap lets your component react to parameter changes without reloading the component, useful for dynamic routes.

beginner

What Angular decorator is used to inject ActivatedRoute into a component?

The constructor parameter with private route: ActivatedRoute injects the service.

intermediate

How can you handle route parameter changes to update component data?

Subscribe to this.route.paramMap and update your component state inside the subscription callback.

Which method gets a route parameter named 'userId' from ActivatedRoute snapshot?

A this.route.snapshot.paramMap.get('userId')

B this.route.paramMap.get('userId')

C this.route.getParam('userId')

D this.route.params['userId']

The correct way to get a parameter from the snapshot is this.route.snapshot.paramMap.get('userId').

Why use paramMap.subscribe() instead of snapshot.paramMap?

A To access route data

B Because snapshot.paramMap is deprecated

C To get query parameters instead

D To react to parameter changes without reloading the component

Subscribing to paramMap allows the component to update when parameters change dynamically.

How do you inject ActivatedRoute into an Angular component?

A Add <code>private route: ActivatedRoute</code> in the constructor

B Use <code>@Inject(ActivatedRoute)</code> decorator

C Import it in the module providers

D Call <code>new ActivatedRoute()</code> inside the component

Angular injects services via constructor parameters marked private or public.

What type of object is paramMap in ActivatedRoute?

A A Promise

B A plain JavaScript object

C An Observable of ParamMap

D A string

paramMap is an Observable that emits ParamMap objects.

Which Angular feature helps you react to route parameter changes?

A Direct DOM manipulation

B Observables and subscriptions

C NgModules

D Template reference variables

Observables let you listen to changes and update your component accordingly.

Explain how to access and use route parameters in an Angular component using ActivatedRoute.

Think about how Angular provides route info and how to react to changes.

Describe why subscribing to paramMap is important for components with dynamic route parameters.

Consider what happens when the URL changes but the component stays loaded.