A set of configuration options for a router module, provided in the forRoot() method.

interface ExtraOptions extends InMemoryScrollingOptions, RouterConfigOptions {
  enableTracing?: boolean
  useHash?: boolean
  initialNavigation?: InitialNavigation
  errorHandler?: ErrorHandler
  preloadingStrategy?: any
  scrollOffset?: [...]
  malformedUriErrorHandler?: (error: URIError, urlSerializer: UrlSerializer, url: string) => UrlTree
  relativeLinkResolution?: 'legacy' | 'corrected'

  // inherited from router/InMemoryScrollingOptions
  anchorScrolling?: 'disabled' | 'enabled'
  scrollPositionRestoration?: 'disabled' | 'enabled' | 'top'

  // inherited from router/RouterConfigOptions
  canceledNavigationResolution?: 'replace' | 'computed'
  onSameUrlNavigation?: 'reload' | 'ignore'
  paramsInheritanceStrategy?: 'emptyOnly' | 'always'
  urlUpdateStrategy?: 'deferred' | 'eager'

See also

  • forRoot()


Property Description
enableTracing?: boolean

When true, log all internal navigation events to the console. Use for debugging.

useHash?: boolean

When true, enable the location strategy that uses the URL fragment instead of the history API.

initialNavigation?: InitialNavigation

One of enabled, enabledBlocking, enabledNonBlocking or disabled. When set to enabled or enabledBlocking, the initial navigation starts before the root component is created. The bootstrap is blocked until the initial navigation is complete. This value is required for server-side rendering to work. When set to enabledNonBlocking, the initial navigation starts after the root component has been created. The bootstrap is not blocked on the completion of the initial navigation. When set to disabled, the initial navigation is not performed. The location listener is set up before the root component gets created. Use if there is a reason to have more control over when the router starts its initial navigation due to some complex initialization logic.

errorHandler?: ErrorHandler

A custom error handler for failed navigations. If the handler returns a value, the navigation Promise is resolved with this value. If the handler throws an exception, the navigation Promise is rejected with the exception.

preloadingStrategy?: any

Configures a preloading strategy. One of PreloadAllModules or NoPreloading (the default).

scrollOffset?: [ number, number ] | (() => [ number, number ])

Configures the scroll offset the router will use when scrolling to an element.

When given a tuple with x and y position value, the router uses that offset each time it scrolls. When given a function, the router invokes the function every time it restores scroll position.

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

A custom handler for malformed URI errors. The handler is invoked when encodedURI contains invalid character sequences. The default implementation is to redirect to the root URL, dropping any path or parameter information. The function takes three parameters:

  • 'URIError' - Error thrown when parsing a bad URL.
  • 'UrlSerializer' - UrlSerializer that’s configured with the router.
  • 'url' - The malformed URL that caused the URIError
relativeLinkResolution?: 'legacy' | 'corrected'

Enables a bug fix that corrects relative link resolution in components with empty paths. Example:

const routes = [
    path: '',
    component: ContainerComponent,
    children: [
      { path: 'a', component: AComponent },
      { path: 'b', component: BComponent },

From the ContainerComponent, you should be able to navigate to AComponent using the following routerLink, but it will not work if relativeLinkResolution is set to 'legacy':

<a [routerLink]="['./a']">Link to A</a>

However, this will work:

<a [routerLink]="['../a']">Link to A</a>

In other words, you're required to use ../ rather than ./ when the relative link resolution is set to 'legacy'.

The default in v11 is corrected.


© 2010–2022 Google, Inc.
Licensed under the Creative Commons Attribution License 4.0.