class
final
Provides access to information about a route associated with a component that is loaded in an outlet. Use to traverse the RouterState
tree and extract information from nodes.
class ActivatedRoute { snapshot: ActivatedRouteSnapshot url: Observable<UrlSegment[]> params: Observable<Params> queryParams: Observable<Params> fragment: Observable<string | null> data: Observable<Data> outlet: string component: Type<any> | string | null routeConfig: Route | null root: ActivatedRoute parent: ActivatedRoute | null firstChild: ActivatedRoute | null children: ActivatedRoute[] pathFromRoot: ActivatedRoute[] paramMap: Observable<ParamMap> queryParamMap: Observable<ParamMap> toString(): string }
The following example shows how to construct a component using information from a currently activated route.
Note: the observables in this class only emit when the current and previous values differ based on shallow equality. For example, changing deeply nested properties in resolved data
will not cause the ActivatedRoute.data
Observable
to emit a new value.
import {Component} from '@angular/core'; /* . . . */ import {ActivatedRoute} from '@angular/router'; import {Observable} from 'rxjs'; import {map} from 'rxjs/operators'; /* . . . */ @Component({ /* . . . */ }) export class ActivatedRouteComponent { constructor(route: ActivatedRoute) { const id: Observable<string> = route.params.pipe(map(p => p.id)); const url: Observable<string> = route.url.pipe(map(segments => segments.join(''))); // route.data includes both `data` and `resolve` const user = route.data.pipe(map(d => d.user)); } }
|
url | Observable | An observable of the URL segments matched by this route. |
params | Observable | An observable of the matrix parameters scoped to this route. |
queryParams | Observable | An observable of the query parameters shared by all the routes. |
fragment | Observable | An observable of the URL fragment shared by all the routes. |
data | Observable | An observable of the static and resolved data of this route. |
outlet | string | The outlet name of the route, a constant. |
component | string | Type | The component of the route, a constant. |
futureSnapshot | ActivatedRouteSnapshot |
Property | Description |
---|---|
snapshot: ActivatedRouteSnapshot | The current snapshot of this route |
url: Observable<UrlSegment[]> | Declared in Constructor An observable of the URL segments matched by this route. |
params: Observable<Params> | Declared in Constructor An observable of the matrix parameters scoped to this route. |
queryParams: Observable<Params> | Declared in Constructor An observable of the query parameters shared by all the routes. |
fragment: Observable<string | null> | Declared in Constructor An observable of the URL fragment shared by all the routes. |
data: Observable<Data> | Declared in Constructor An observable of the static and resolved data of this route. |
outlet: string | Declared in Constructor The outlet name of the route, a constant. |
component: Type<any> | string | null | Declared in Constructor The component of the route, a constant. |
routeConfig: Route | null | Read-Only The configuration used to match this route. |
root: ActivatedRoute | Read-Only The root of the router state. |
parent: ActivatedRoute | null | Read-Only The parent of this route in the router state tree. |
firstChild: ActivatedRoute | null | Read-Only The first child of this route in the router state tree. |
children: ActivatedRoute[] | Read-Only The children of this route in the router state tree. |
pathFromRoot: ActivatedRoute[] | Read-Only The path from the root of the router state tree to this route. |
paramMap: Observable<ParamMap> | Read-Only An Observable that contains a map of the required and optional parameters specific to the route. The map supports retrieving single and multiple values from the same parameter. |
queryParamMap: Observable<ParamMap> | Read-Only An Observable that contains a map of the query parameters available to all routes. The map supports retrieving single and multiple values from the query parameter. |
toString() |
---|
|
© 2010–2021 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://v12.angular.io/api/router/ActivatedRoute