Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Subscribe
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
Angular 2 Routing: Up And Running
Rating: 4.0 out of 5(326 ratings)
12,434 students

Angular 2 Routing: Up And Running

Get Up To Speed With Angular 2 Routing In just A Quick 30 Minutes
Created byBTree Press
Last updated 11/2017
English

What you'll learn

  • Build A Angular Route
  • Map Routes To Components
  • Work WIth Router Links
  • Lazy Load Modules With Angular 2 Router
  • How To Use The Router Link Active To Style The Angular 2 Navigation Elements
  • Build Dynamic Navigation With Angular 2 Ng For
  • Dynamically Create Navigation With Angular 2 Router
  • Use Route Params To Load Data In Angular 2 Router
  • Managing Rx Subscriptions With Async Pipe And Behavior Subjects

Explore related topics

Course content

4 sections • 14 lectures • 41m total length

  • Introduction1:49
  • Angular CLI vs Google Seed Project2:04

    In the Lecture I go over how you can use the Angular CLI to create our start project. I have done this for you already and its in the course exercise files under chapter 0. I thought you might find it interesting

  • Exercise Files1:29

  • The First Angular 2 Route3:54

    Using the Angular 2 router requires defining routes, passing them in to the RouterModule.forRoot and then importing the configured RouterModule into your main App Module.

  • Mapping Routes To A Components1:03

    Mapping Angular 2 routes to components is fairly straight-forward, but if you’re not going to lazy load in modules, then you’ll need to make sure to reference each Component you’re using in your main App Module.

  • How To Work With Router Link In Angular 2 Navigation0:55
    Angular 2 navigation is configured using the routerLink directive. The routerLink directive behaves like an href’s you are familiar with, but it hooks into Angular 2’s router to navigate between your defined routes.
  • Lazy Load Modules With Angular 2 Router5:37

    Angular 2 lazy loading is a core feature of Angular 2. Lazy loading allows your application to start up faster because it only needs to use the main App Module when the page initially loads. As you navigate between routes, it will load the additional modules as you define them in your routes. Make sure to properly organize your files into Angular 2’s module pattern so that files that belong to each module don’t get required by other modules.

  • How To Use The Router Link Active To Style The Angular 2 Navigation Elements2:15

    You can easily show the user which route they are on using Angular 2’s routerLinkActive. Whenever a route matches the routerLink defined on the element, then the routerLInkActive will add the class that you assign it to.


  • Use Route Params Inside Of Components In Angular 23:35

    Angular 2’s ActivatedRoute allows you to get the details of the current route into your components. Params on the ActivatedRoute are provided as streams, so you can easily map the param you want off of the stream and display it in your template.

Requirements

  • Angular Basics
  • Javascript Basics
  • That they want to kick some router but

Description

Angular 2's router comes with many features for routing based on path's and loading specific components. This course gives you a fast and furious intro to how to configure your routes, navigate between them, and use services and guards when navigating to routes.


!!--------------------------------------!!

I haven't had a chance to go through the code on this course since the angular 5 release. So please be aware there could be some changes in the last release. 

!!--------------------------------------!!


In the Up and Running Series Courses we dive straight into the working examples. There are little to no slides in these courses. No long running intro videos and no installation videos. This is a learn by real world working example course. These courses are set up so that in about 1 hour you will be up and running with a new technology.

This is not a beginner course. We will not go over basic angular functions this course is designed for one reason and one reason only. To go over the Angular Router. This Angular 2 course assumes knowledge of some fundamentals. If you haven't learned the fundamentals yet please use my angular 2 course Step by Step course to get started then come back. 

 In this course Luke Angel, a Sr. Technical Cross Platform Program Manager working at companies ranging from startups to Fortune 100's, building technology-driven marketing solutions with global reach and Netflix scale. Luke will guide through all the steps it takes to work the Angular 2 router.  

In this course you will learn:

  1. The First Angular 2 Route
  2. Mapping Routes To A Components
  3. How To Work With Router Link In Angular 2 Navigation
  4. Lazy Load Modules With Angular 2 Router
  5. How To Use The Router Link Active To Style The Angular 2 Navigation Elements
  6. Use Route Params Inside Of Components In Angular 2
  7. Build Dynamic Navigation With Angular 2 Ng For
  8. Dynamically Create Navigation With Angular 2 Router
  9. Use Route Params To Load Data In Angular 2 Router
  10. Managing Rx Subscriptions With Async Pipe And Behavior Subjects

 This course does not hold back by design so you need to step up and hold on as we go through information at warp speed. This is by design to get up and running within your lunch hour. So hold on to your hats!

Who this course is for:

  • People who want to know more about angular router
  • People who like angular
  • People who love angular
  • People who want to build kick but applications

Report abuse