W3cubDocs

/Angular 7

ActivatedRoute

interface

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.

See more...

interface ActivatedRoute {
  snapshot: ActivatedRouteSnapshot
  url: Observable<UrlSegment[]>
  params: Observable<Params>
  queryParams: Observable<Params>
  fragment: Observable<string>
  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
}

Description

@Component({...})
class MyComponent {
  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));
  }
}

Properties

Property Description
snapshot: ActivatedRouteSnapshot

The current snapshot of this route

url: Observable<UrlSegment[]>

An observable of the URL segments matched by this route

params: Observable<Params>

An observable of the matrix parameters scoped to this route

queryParams: Observable<Params>

An observable of the query parameters shared by all the routes

fragment: Observable<string>

An observable of the URL fragment shared by all the routes

data: Observable<Data>

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

outlet: string

The outlet name of the route. It's a constant

component: Type<any> | string | null

The component of the route. It's 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.
queryParamMap: Observable<ParamMap> Read-only.

Methods

toString(): string

Parameters

There are no parameters.

Returns

string

© 2010–2019 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.
https://v7.angular.io/api/router/ActivatedRoute