Join egghead, unlock knowledge.

Want more egghead?

This lesson is for members. Join us? Get access to all 3,000+ tutorials + a community with expert developers around the world.

Unlock This Lesson
Become a member
to unlock all features

Level Up!

Access all courses & lessons on egghead today and lock-in your price for life.


    AngularJS 1.2.x Routing Changes: ngRoute


    John LindquistJohn Lindquist

    In AngularJS redirectTo is often assigned a simple static string and thus points invariably to one location (redirectTo: '/mypath'). You can customize this, by setting redirectTo as a function, which arguments are the route params. For instance, if you hit the route "/pizza/peperoni", you can compose your redirection to be "/pizzas", or whatever suits your needs



    Become a Member to view code

    You must be a Member to view code

    Access all courses and lessons, track your progress, gain confidence and expertise.

    Become a Member
    and unlock code for this lesson




    John Lindquist: The most common scenario for using redirectTo is to, when someone types a URL that doesn't make any sense, just redirect them to home, so "/," or some error page, or whatever you want. Let's type in "/foo," you get back home. If I type in "/anything," we'll get back home.

    Basically, anything that doesn't match. So "/pizza" should still match. But anything else will just send you back home.

    The other thing you can do, which you don't see used as much, is you can actually pass a function and return the path you want it to be sent to. Now, if I type in "/pizza," it will send it back home, because we have a function that's telling it to go home.

    What we can do with this function is actually take in a few of the parameters that are passed in, and get this info. So, "routeParams," and then the second one is the "path," and the third one is called "search." We can get some routeParams off of here; we can say "crust" and "toppings." And from there on out, if we just log out, console.log() routeParams, and path, and search.

    If I refresh this and type in "/pizza," and then crust, we'll say "/deep," and then toppings, we'll do "/pepperoni." Hit enter. You can see that we get crust of "deep," toppings of "pepperoni," we get the path, and this last search object is when you do something like "/pizza," and then we'll add our search object to "deliver" using "now."

    You can see, you can take that information, and then use it to form a new URL, somewhere else to send them to. Say, if someone typed in a bad pizza URL that you didn't quite handle, you could say, "Well, I want to send them to the crust page." Say, routeParams.crust of, say when crust is "deep," we want to display "Deep dish" as the template.

    If we pass in that URL again, "/pizza," because I passed in "/pizza/deep/pepperoni," and that search term and everything, I was able to grab "deep" off of the routeParams and then send it back to a different route, here defined as "deep," and then render out another template.

    This redirectTo, when you pass in a function, allows you to handle however you want to handle these different routeParams and path and search. You can combine it to make whatever URL you want, and redirect them to something that makes sense, instead of just using it as a string, which always just sends them to a particular URL.