Router

Provides the navigation and url manipulation capabilities.

Example

Imperative navigation:

export class AppComponent {
  constructor(private router: Router) {
  }

  navigateToHome() {
    this.router.navigate('/home');
  }
}

Interface

Properties

config#

Routes configuration.

config: Routes

createUrlTree()#

Applies an array of commands to the current url tree and creates a new url tree.

createUrlTree(commands: any[], navigationExtras: NavigationExtras = {}): UrlTree

dispose()#

Disposes of the router.

dispose(): void

errorHandler#

Error handler that is invoked when a navigation errors.

errorHandler: ErrorHandler

events#

Observable that provides all routing events.

events: Observable<Event>

initialNavigation()#

Sets up the location change listener and performs the initial navigation.

initialNavigation(): void

isActive()#

Returns whether the url is activated.

isActive(url: string | UrlTree, exact: boolean): boolean

malformedUriErrorHandler#

Malformed uri error handler is invoked when Router.parseUrl(url) throws an error due to containing an invalid character. The most common case would be a % sign that's not encoded and is not part of a percent encoded sequence.

malformedUriErrorHandler: (error: URIError, urlSerializer: UrlSerializer, url: string) => UrlTree

Navigate based on the provided array of commands and a starting point. If no starting route is provided, the navigation is absolute.

navigate(commands: any[], extras: NavigationExtras = { skipLocationChange: false }): Promise<boolean>

Returns a Promise that:

  • resolves to true when navigation succeeds,
  • resolves to false when navigation fails,
  • is rejected when an error happens.

Example

router.navigate(['team', 33, 'user', 11], {relativeTo: route});

// Navigate without updating the URL
router.navigate(['team', 33, 'user', 11], {relativeTo: route, skipLocationChange: true});

The first parameter of navigate() is a delta to be applied to the current URL or the one provided in the relativeTo property of the second parameter (the NavigationExtras).

Navigate based on the provided url. This navigation is always absolute.

navigateByUrl(url: string | UrlTree, extras: NavigationExtras = { skipLocationChange: false }): Promise<boolean>

Returns a Promise that:

  • resolves to true when navigation succeeds,
  • resolves to false when navigation fails,
  • is rejected when an error happens.

Example

router.navigateByUrl("/team/33/user/11");

// Navigate without updating the URL
router.navigateByUrl("/team/33/user/11", { skipLocationChange: true });

Since navigateByUrl() takes an absolute URL as the first parameter, it will not apply any delta to the current URL and ignores any properties in the second parameter (the NavigationExtras that would change the provided URL.

Indicates if at least one navigation happened.

navigated: boolean

onSameUrlNavigation#

Define what the router should do if it receives a navigation request to the current URL.

onSameUrlNavigation: 'reload' | 'ignore'

paramsInheritanceStrategy#

Defines how the router merges params, data and resolved data from parent to child routes. More info in the configuration section.

paramsInheritanceStrategy: 'emptyOnly' | 'always'

parseUrl()#

Parses a string into a UrlTree.

parseUrl(url: string): UrlTree

resetConfig()#

Resets the configuration used for navigation and generating links.

resetConfig(config: Routes): void

routeReuseStrategy#

-

routeReuseStrategy: RouteReuseStrategy

routerState#

Contains current router state.

routerState: RouterState

serializeUrl()#

Serializes a UrlTree into a string.

serializeUrl(url: UrlTree): string

setUpLocationChangeListener()#

Sets up the location change listener.

setUpLocationChangeListener(): void

url#

The current url.

url: string

urlHandlingStrategy#

Extracts and merges URLs. Used for AngularJS to Angular migrations.

urlHandlingStrategy: UrlHandlingStrategy

urlUpdateStrategy#

Defines when the router updates the browser URL. More info in the configuration section.

urlUpdateStrategy: 'deferred' | 'eager'

Methods