ActivatedRoute

This is the documentation for Angular 6.
You can switch to the latest version Angular 7.

Contains the information about a route associated with a component loaded in an outlet. An ActivatedRoute can also be used to traverse the router state tree.

Example

@Component({...})
class MyComponent {
  constructor(route: ActivatedRoute) {
    const id: Observable<string> = route.params.map(p => p.id);
    const url: Observable<string> = route.url.map(segments => segments.join(''));
    // route.data includes both `data` and `resolve`
    const user = route.data.map(d => d.user);
  }
}
Tutorials

Properties

snapshot#

The current snapshot of this route.

snapshot: ActivatedRouteSnapshot

url#

An observable of the URL segments matched by this route.

url: Observable<UrlSegment[]>

params#

An observable of the matrix parameters scoped to this route.

params: Observable<Params>

queryParams#

An observable of the query parameters shared by all the routes.

queryParams: Observable<Params>

fragment#

An observable of the URL fragment shared by all the routes.

fragment: Observable<string>

data#

An observable of the static and resolved data of this route.

data: Observable<Data>

outlet#

The outlet name of the route.

outlet: string

component#

The component of the route.

component: Type<any> | string | null

routeConfig#

The configuration used to match this route.

routeConfig: Route | null

root#

The root of the router state.

root: ActivatedRoute

parent#

The parent of this route in the router state tree.

parent: ActivatedRoute | null

firstChild#

The first child of this route in the router state tree.

firstChild: ActivatedRoute | null

children#

The children of this route in the router state tree.

children: ActivatedRoute[]

pathFromRoot#

The path from the root of the router state tree to this route.

pathFromRoot: ActivatedRoute[]

paramMap#

TODO

paramMap: Observable<ParamMap>

queryParamMap#

TODO

queryParamMap: Observable<ParamMap>