ExtraOptions
A set of configuration options for a router module, provided in the
forRoot()
method.
interface ExtraOptions extends InMemoryScrollingOptions {}
enableTracing
boolean | undefined
When true, log all internal navigation events to the console. Use for debugging.
useHash
boolean | undefined
When true, enable the location strategy that uses the URL fragment instead of the history API.
bindToComponentInputs
boolean | undefined
enableViewTransitions
boolean | undefined
When true, enables view transitions in the Router by running the route activation and
deactivation inside of document.startViewTransition
.
errorHandler
((error: any) => any) | undefined
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]) | undefined
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.
anchorScrolling
"disabled" | "enabled" | undefined
When set to 'enabled', scrolls to the anchor element when the URL has a fragment. Anchor scrolling is disabled by default.
Anchor scrolling does not happen on 'popstate'. Instead, we restore the position that we stored or scroll to the top.
scrollPositionRestoration
"disabled" | "enabled" | "top" | undefined
Configures if the scroll position needs to be restored when navigating back.
- 'disabled'- (Default) Does nothing. Scroll position is maintained on navigation.
- 'top'- Sets the scroll position to x = 0, y = 0 on all navigation.
- 'enabled'- Restores the previous scroll position on backward navigation, else sets the position to the anchor if one is provided, or sets the scroll position to [0, 0] (forward navigation). This option will be the default in the future.
You can implement custom scroll restoration behavior by adapting the enabled behavior as in the following example.
class AppComponent { movieData: any; constructor(private router: Router, private viewportScroller: ViewportScroller,changeDetectorRef: ChangeDetectorRef) { router.events.pipe(filter((event: Event): event is Scroll => event instanceof Scroll) ).subscribe(e => { fetch('http://example.com/movies.json').then(response => { this.movieData = response.json(); // update the template with the data before restoring scroll changeDetectorRef.detectChanges(); if (e.position) { viewportScroller.scrollToPosition(e.position); } }); }); }}
paramsInheritanceStrategy
"emptyOnly" | "always" | undefined
Defines how the router merges parameters, data, and resolved data from parent to child routes.
By default ('emptyOnly'), a route inherits the parent route's parameters when the route itself has an empty path (meaning its configured with path: '') or when the parent route doesn't have any component set.
Set to 'always' to enable unconditional inheritance of parent parameters.
Note that when dealing with matrix parameters, "parent" refers to the parent Route
config which does not necessarily mean the "URL segment to the left". When the Route
path
contains multiple segments, the matrix parameters must appear on the last segment. For example,
matrix parameters for {path: 'a/b', component: MyComp}
should appear as a/b;foo=bar
and not
a;foo=bar/b
.
urlUpdateStrategy
"deferred" | "eager" | undefined
Defines when the router updates the browser URL. By default ('deferred'), update after successful navigation. Set to 'eager' if prefer to update the URL at the beginning of navigation. Updating the URL early allows you to handle a failure of navigation by showing an error message with the URL that failed.
defaultQueryParamsHandling
QueryParamsHandling | undefined
The default strategy to use for handling query params in Router.createUrlTree
when one is not provided.
The createUrlTree
method is used internally by Router.navigate
and RouterLink
.
Note that QueryParamsHandling
does not apply to Router.navigateByUrl
.
When neither the default nor the queryParamsHandling option is specified in the call to createUrlTree
,
the current parameters will be replaced by new parameters.