@angular/router

ActivatedRouteSnapshot

Class

stable

Contains the information about a route associated with a component loaded in an outlet at a particular moment in time. ActivatedRouteSnapshot can also be used to traverse the router state tree.

API

    
      class ActivatedRouteSnapshot {}

constructor

ActivatedRouteSnapshot

@paramurlUrlSegment[]

The URL segments matched by this route

@paramparamsParams

The matrix parameters scoped to this route.

You can compute all params (or data) in the router state or to get params outside of an activated component by traversing the RouterState tree as in the following example:

collectRouteParams(router: Router) {  let params = {};  let stack: ActivatedRouteSnapshot[] = [router.routerState.snapshot.root];  while (stack.length > 0) {    const route = stack.pop()!;    params = {...params, ...route.params};    stack.push(...route.children);  }  return params;}

@paramqueryParamsParams

The query parameters shared by all the routes

@paramfragmentstring | null

The URL fragment shared by all the routes

@paramdataData

The static and resolved data of this route

@paramoutletstring

The outlet name of the route

@paramcomponentType<any> | null

The component of the route

@paramrouteConfigRoute | null

@paramresolveResolveData

@returnsActivatedRouteSnapshot

routeConfig

Route | null

The configuration used to match this route *

title

string | undefined

The resolved route title

url

UrlSegment[]

The URL segments matched by this route

params

Params

The matrix parameters scoped to this route.

You can compute all params (or data) in the router state or to get params outside of an activated component by traversing the RouterState tree as in the following example:

collectRouteParams(router: Router) {  let params = {};  let stack: ActivatedRouteSnapshot[] = [router.routerState.snapshot.root];  while (stack.length > 0) {    const route = stack.pop()!;    params = {...params, ...route.params};    stack.push(...route.children);  }  return params;}

queryParams

Params

The query parameters shared by all the routes

fragment

string | null

The URL fragment shared by all the routes

data

Data

The static and resolved data of this route

outlet

string

The outlet name of the route

component

Type<any> | null

The component of the route

root

ActivatedRouteSnapshot

The root of the router state

parent

ActivatedRouteSnapshot | null

The parent of this route in the router state tree

firstChild

ActivatedRouteSnapshot | null

The first child of this route in the router state tree

children

ActivatedRouteSnapshot[]

The children of this route in the router state tree

pathFromRoot

ActivatedRouteSnapshot[]

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

paramMap

ParamMap

queryParamMap

ParamMap

toString

string

@returnsstring

Description

Contains the information about a route associated with a component loaded in an outlet at a particular moment in time. ActivatedRouteSnapshot can also be used to traverse the router state tree.

The following example initializes a component with route information extracted from the snapshot of the root node at the time of creation.

@Component({templateUrl:'./my-component.html'})class MyComponent {  constructor(route: ActivatedRoute) {    const id: string = route.snapshot.params.id;    const url: string = route.snapshot.url.join('');    const user = route.snapshot.data.user;  }}