Angular 2 - How to navigate to another route using this router parent navigate about

Question

Angular 2 - How to navigate to another route using this router parent navigate   about     It doesnt seem to work  I tried location go   about    as that didnt work   Basically once a user has logged in I want to redirect them to another page   Here is my code below    import  Component  from  angular2 angular2    import  CORE DIRECTIVES  FORM DIRECTIVES  from  angular2 angular2    import  Router  from  angular2 router     import  AuthService  from        authService       Model  class User      constructor public email  string  public password  string           Component      templateUrl  src app components todo todo html      directives   CORE DIRECTIVES  FORM DIRECTIVES        export class Todo           model   new User  Mark gmail com    Password          authService AuthService       router  Router      constructor  router  Router   authService  AuthService             this authService    authService         this router    router           onLogin        gt           this authService logUserIn this model  then  success    gt                       This is where its broke - below                      this router parent navigate   about

User · Answer

import   Router   from   angular router     in your constructor constructor public router  Router       navigation  link this router navigateByUrl   home

User · Answer

Absolute path routing  There are 2 methods for navigation   navigate   and  navigateByUrl    You can use the method  navigateByUrl   for absolute path routing   import  Router  from   angular router    constructor private router  Router      navigateToLogin        this router navigateByUrl   login        You put the absolute path to the URL of the component you want to navigate to    Note  Always specify the complete absolute path when calling router s navigateByUrl method  Absolute paths must start with a leading       Absolute route - Goes up to root level     this router navigate    root child child         Absolute route - Goes up to root level with route params    this router navigate    root child   crisis id      Relative path routing  If you want to use relative path routing  use the  navigate   method    NOTE  It s a little unintuitive how the routing works  particularly parent  sibling  and child routes      Parent route - Goes up one level      notice the how it seems like you re going up 2 levels  this router navigate         parent      relativeTo  this route         Sibling route - Stays at the current level and moves laterally       looks like up to parent then down to sibling  this router navigate      sibling      relativeTo  this route         Child route - Moves down one level this router navigate     child      relativeTo  this route         Moves laterally  and also add route parameters    if you are at the root and crisis id   15  will result in   sibling 15  this router navigate      sibling   crisis id     relativeTo  this route         Moves laterally  and also add multiple route parameters    will result in   sibling id 15 foo foo       Note  this does not produce query string URL notation with   and  amp      instead it    produces a matrix URL notation  an alternative way to pass parameters in a URL  this router navigate      sibling     id  crisis id  foo   foo        relativeTo  this route       Or if you just need to navigate within the current route path  but to a different route parameter       If crisis id has a value of  15     This will take you from   hero  to   hero 15  this router navigate  crisis id     relativeTo  this route       Link parameters array  A link parameters array holds the following ingredients for router navigation    The path of the route to the destination component     hero   Required and optional route parameters that go into the route URL     hero   hero id  or    hero     id  hero id  foo  baa      Directory-like syntax  The router supports directory-like syntax in a link parameters list to help guide route name lookup      or no leading slash is relative to the current level       to go up one level in the route path   You can combine relative navigation syntax with an ancestor path  If you must navigate to a sibling route  you could use the     lt sibling gt  convention to go up one level  then over and down the sibling route path   Important notes about relative nagivation  To navigate a relative path with the Router navigate method  you must supply the ActivatedRoute to give the router knowledge of where you are in the current route tree   After the link parameters array  add an object with a relativeTo property set to the ActivatedRoute  The router then calculates the target URL based on the active route s location   From official Angular Router Documentation

User · Answer

Personally  I found that  since we maintain a ngRoutes collection  long story  i find the most enjoyment from   GOTO ri        this router navigate this ngRoutes ri        I actually use it as part of one of our interview questions  This way  I can get a near-instant read at who s been developing forever by watching who twitches when they run into GOTO 1  for Homepage redirection

User · Answer

Also can use without parent  say router definition like    path   about      name   About     component  AboutComponent    then can navigate by name instead of path  goToAboutPage         this router navigate   About        here  About  is name not path     Updated for V2 3 0  In Routing from v2 0 name property no more exist  route define without name property  so you should use path instead of name  this router navigate    path    and no leading slash for path so use path   about  instead of path    about   router definition like    path  about   component  AboutComponent    then can navigate by path  goToAboutPage         this router navigate    about        here  About  is path

User · Answer

You should use  this router parent navigate    About       As well as specifying the route path  you can also specify your route s name     path   About   name   About            this router parent navigate   About

[angular] Angular 2 - How to navigate to another route using this.router.parent.navigate('/about')?

Examples related to angular

Examples related to typescript

Examples related to angular2-routing