{ "id": "api/router/ActivatedRouteSnapshot", "title": "ActivatedRouteSnapshot", "contents": "\n\n
\n
\n
\n \n API > @angular/router\n
\n
\n mode_edit\n code\n
\n
\n \n
\n

ActivatedRouteSnapshotlink

\n \n \n \n \n \n
\n \n \n\n
\n \n
\n

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

\n\n

See more...

\n
\n \n \n
\n\ninterface ActivatedRouteSnapshot {\n routeConfig: Route | null\n url: UrlSegment[]\n params: Params\n queryParams: Params\n fragment: string | null\n data: Data\n outlet: string\n component: Type<any> | string | null\n root: ActivatedRouteSnapshot\n parent: ActivatedRouteSnapshot | null\n firstChild: ActivatedRouteSnapshot | null\n children: ActivatedRouteSnapshot[]\n pathFromRoot: ActivatedRouteSnapshot[]\n paramMap: ParamMap\n queryParamMap: ParamMap\n toString(): string\n}\n\n\n \n \n\n\n \n \n\n
\n\n \n\n \n \n
\n

Descriptionlink

\n

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

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

Propertieslink

\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
PropertyDescription
\n \n routeConfig: Route | null\n Read-Only\n \n

The configuration used to match this route *

\n\n \n
\n \n url: UrlSegment[]\n \n \n

The URL segments matched by this route

\n\n \n
\n \n params: Params\n \n \n

The matrix parameters scoped to this route.

\n\n

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

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

The query parameters shared by all the routes

\n\n \n
\n \n fragment: string | null\n \n \n

The URL fragment shared by all the routes

\n\n \n
\n \n data: Data\n \n \n

The static and resolved data of this route

\n\n \n
\n \n outlet: string\n \n \n

The outlet name of the route

\n\n \n
\n \n component: Type<any> | string | null\n \n \n

The component of the route

\n\n \n
\n \n root: ActivatedRouteSnapshot\n Read-Only\n \n

The root of the router state

\n\n \n
\n \n parent: ActivatedRouteSnapshot | null\n Read-Only\n \n

The parent of this route in the router state tree

\n\n \n
\n \n firstChild: ActivatedRouteSnapshot | null\n Read-Only\n \n

The first child of this route in the router state tree

\n\n \n
\n \n children: ActivatedRouteSnapshot[]\n Read-Only\n \n

The children of this route in the router state tree

\n\n \n
\n \n pathFromRoot: ActivatedRouteSnapshot[]\n Read-Only\n \n

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

\n\n \n
\n \n paramMap: ParamMap\n Read-Only\n \n \n \n
\n \n queryParamMap: ParamMap\n Read-Only\n \n \n \n
\n
\n \n\n
\n

Methodslink

\n \n \n\n \n \n \n \n \n \n \n \n\n \n\n \n \n
\n
\n

\n toString()\n \n link

\n
\n mode_edit\n code\n
\n
\n
\n
\n \n\n toString(): string\n\n \n\n
Parameters
\n

There are no parameters.

\n\n \n
Returns
\n

string

\n\n \n\n\n \n\n \n
\n
\n\n \n
\n\n\n \n\n\n
\n
\n\n\n" }