Query parameters and fragments in Angular - Cheat Sheet & Quick Revision

Recall & Review

beginner

What are query parameters in Angular routing?

Query parameters are extra bits of information added to the URL after a question mark (?). They help pass data to a route without changing the route path.

beginner

How do you access query parameters in an Angular component?

You use the ActivatedRoute service and subscribe to the queryParamMap observable to get query parameters inside your component.

beginner

What is a URL fragment in Angular routing?

A fragment is the part of the URL after a hash (#). It usually points to a section inside the page, like an anchor link.

intermediate

How do you navigate to a route with query parameters and a fragment in Angular?

Use the Router's navigate method with an object containing queryParams and fragment properties, like: router.navigate(['/path'], { queryParams: { key: 'value' }, fragment: 'section' }).

intermediate

Why should you use query parameters instead of route parameters for optional data?

Query parameters keep the route path clean and stable. They are good for optional or filter data that doesn't affect the main route structure.

Which symbol starts query parameters in a URL?

A &

B ?

C #

D /

Query parameters start after a question mark (?) in the URL.

How do you read query parameters inside an Angular component?

A Using ActivatedRoute's queryParamMap observable

B Using Router's navigate method

C Using window.location.hash

D Using document.querySelector

ActivatedRoute's queryParamMap observable provides access to query parameters.

What does the fragment part of a URL represent?

A A section inside the page, after #

B The main route path

C Query parameters

D The domain name

The fragment is the part after # and usually points to a page section.

Which Angular service helps navigate with query parameters and fragments?

A ActivatedRoute

B HttpClient

C Router

D Location

Router service is used to navigate and set query parameters and fragments.

Why use query parameters instead of route parameters for optional data?

A Because route parameters are deprecated

B To avoid using fragments

C Because query parameters are faster

D To keep the route path clean and stable

Query parameters keep the route path clean and are good for optional data.

Explain how to add and read query parameters and fragments in Angular routing.

Think about how URLs have ? for query and # for fragments.

Describe when and why you would use query parameters versus route parameters in Angular.

Consider how the URL looks and what changes the route path.