Angular Routing Essentials: All You Need to Know in One Video!

In this video, we'll cover all the essential concepts of Angular Routing in one comprehensive session. You'll learn how to create routes, set up nested routes, and use the router-outlet effectively. We'll also dive into reading route parameters and query parameters using Angular Signals. Additionally, we'll explore how to protect routes with guards and resolve data before navigating. By the end of this video, you'll have a solid understanding of Angular Routing, equipped with practical skills to implement in your projects!

MOST POPULAR COURSES

SERVICES THAT I'M USING

TIMESTAMPS
0:00 Introduction
1:06 Defining Routes
2:17 Router Outlet
3:43 Router Links
4:36 Routes Order
5:20 Dynamic Params
6:18 Accessing Params
8:32 Query Params
9:45 Redirects
10:27 Not Found Route
11:19 Redirect Function
12:47 Nested Routes
14:13 Active Routes
15:12 Exact Route Match
15:53 Programmatic Navigation
17:25 Lazy Loading
18:38 Route Guard
19:44 Route Resolver

CONNECT WITH ME!

REFERENCES

Some product links are affiliate links which means if you buy something I'll receive a small commission.

[manojv]

This is great way of reading data from dynamic parameters and query parameters. Previously we had to subscribe in order to get the data. Love your content. Thank you

Also i had taken up your ngrx course on udemy. But now i think we need a refresh of the same as we now have signal stores 😅😅

[tobalhenriquez]

You are the best!! I will buy one of these courses for sure!!

[Time-mvoo]

What an amazing video. Thank you very much i really learned alot!

[shahnawazk]

Great video and very much helpful, Keep it up!

[bartlomiejuminski]

19:44 I would like to see how to use async resolver to load data from the API, based on route paramater.

[wilco]

Could you share your vscode profile/config, looks nice

[xEnergyGamingHD]

can angular also infer the queryParams when the route component is a module? Or does this only work for standalone components?

[mrluckyuncle]

How does the “input” signal return different values?

[VinodSalunke-tx]

am getting this compilation issue while using redirectTo

Type '(routes: any) => string' is not assignable to type 'string'.

below is my code for it

{
path:'old-pages/:pageId',
redirectTo: (routes)=>{
return
},
},