redirectTo

John Lindquist
InstructorJohn Lindquist
Share this video with your friends

Social Share Links

Send Tweet
Published 11 years ago
Updated 5 years ago

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

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.

egghead
egghead
~ an hour ago

Member comments are a way for members to communicate, interact, and ask questions about a lesson.

The instructor or someone from the community might respond to your question Here are a few basic guidelines to commenting on egghead.io

Be on-Topic

Comments are for discussing a lesson. If you're having a general issue with the website functionality, please contact us at support@egghead.io.

Avoid meta-discussion

  • This was great!
  • This was horrible!
  • I didn't like this because it didn't match my skill level.
  • +1 It will likely be deleted as spam.

Code Problems?

Should be accompanied by code! Codesandbox or Stackblitz provide a way to share code and discuss it in context

Details and Context

Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!

Markdown supported.
Become a member to join the discussionEnroll Today