Geek Answers Handbook

Angular 2 new (RC1) router. Nested Routes

In a beta version from a child component (let's say 'child1'), you could say that your parent uploaded (switch) to another child component instead of the current one using something like this:

 _router.parent.navigate(['child2']);

('_router' is injected in constructor)

RC1 does not have the “parent” property, so it seems to you that you need to use _router.navigate()and provide the full URL, starting from the root of the application. Sort of

/root/grandparent/parent/child2

Now the question is that the child component only knows about parent routes, but not about grandparents - how do you do this? It would be nice to use _router.navigate(['../child2']), but it gives me weird errors like"invalid number of '../'.

The only way to get the parent url I have found so far is this:

_router.routeTree._root.children[0].value.stringifiedUrlSegments

( OnActivate)

. / - .

, , , - ?

.

+4
1

. ( router.ts : 89)

/**
   * Navigate based on the provided array of commands and a starting point.
   * If no segment is provided, the navigation is absolute.
   *
   * ### Usage
   *
   * ```
   * router.navigate(['team', 33, 'team', '11], segment);
   * ```
   */
  navigate(commands: any[], segment?: RouteSegment): Promise<void> {
    return this._navigate(this.createUrlTree(commands, segment));
  }

RouteSegment

import { Router, RouteSegment } from '@angular/router';
...
contructor(private $_router:Router, private $_segment:RouteSegment){}
...

//If you are in for example child1 and child 1 is sibling of child2
this.$_router.navigate(['../child2'],this.$_segment);
+4

More articles:


All Articles