5 lines
18 KiB
JSON
5 lines
18 KiB
JSON
{
|
||
"id": "api/router/ExtraOptions",
|
||
"title": "ExtraOptions",
|
||
"contents": "\n\n<article>\n <div class=\"breadcrumb-container\">\n <div class=\"breadcrumb\">\n <script type=\"application/ld+json\">\n {\n \"@context\": \"http://schema.org\",\n \"@type\": \"BreadcrumbList\",\n \"itemListElement\": [\n { \"@type\": \"ListItem\", \"position\": 1, \"item\": { \"@id\": \"https://angular.io//api\", \"name\": \"API\" } },\n { \"@type\": \"ListItem\", \"position\": 2, \"item\": { \"@id\": \"https://angular.io/api/router\", \"name\": \"@angular/router\" } },\n { \"@type\": \"ListItem\", \"position\": 3, \"item\": { \"@id\": \"https://angular.io/api/router/ExtraOptions\", \"name\": \"ExtraOptions\" } }\n ]\n }\n </script>\n <a href=\"/api\">API</a> > <a href=\"api/router\">@angular/router</a>\n </div>\n <div class=\"github-links\">\n <a href=\"https://github.com/angular/angular/edit/master/packages/router/src/router_module.ts?message=docs(router)%3A%20describe%20your%20change...#L246-L430\" aria-label=\"Suggest Edits\" title=\"Suggest Edits\"><i class=\"material-icons\" aria-hidden=\"true\" role=\"img\">mode_edit</i></a>\n <a href=\"https://github.com/angular/angular/tree/12.0.0-next.7/packages/router/src/router_module.ts#L246-L430\" aria-label=\"View Source\" title=\"View Source\"><i class=\"material-icons\" aria-hidden=\"true\" role=\"img\">code</i></a>\n</div>\n </div>\n \n <header class=\"api-header\">\n <h1 id=\"extraoptions\">ExtraOptions<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"api/router/ExtraOptions#extraoptions\"><i class=\"material-icons\">link</i></a></h1>\n \n <label class=\"api-type-label interface\">interface</label>\n \n \n \n </header>\n \n <aio-toc class=\"embedded\"></aio-toc>\n\n <div class=\"api-body\">\n \n <section class=\"short-description\">\n <p>A set of configuration options for a router module, provided in the\n<code>forRoot()</code> method.</p>\n\n \n </section>\n \n \n <section class=\"interface-overview\">\n<code-example language=\"ts\" hidecopy=\"true\">\ninterface <a href=\"api/router/ExtraOptions\" class=\"code-anchor\">ExtraOptions</a> {\n <a class=\"code-anchor\" href=\"api/router/ExtraOptions#enableTracing\"><span class=\"member-name\">enableTracing</span>?: boolean</a>\n <a class=\"code-anchor\" href=\"api/router/ExtraOptions#useHash\"><span class=\"member-name\">useHash</span>?: boolean</a>\n <a class=\"code-anchor\" href=\"api/router/ExtraOptions#initialNavigation\"><span class=\"member-name\">initialNavigation</span>?: InitialNavigation</a>\n <a class=\"code-anchor\" href=\"api/router/ExtraOptions#errorHandler\"><span class=\"member-name\">errorHandler</span>?: ErrorHandler</a>\n <a class=\"code-anchor\" href=\"api/router/ExtraOptions#preloadingStrategy\"><span class=\"member-name\">preloadingStrategy</span>?: any</a>\n <a class=\"code-anchor\" href=\"api/router/ExtraOptions#onSameUrlNavigation\"><span class=\"member-name\">onSameUrlNavigation</span>?: 'reload' | 'ignore'</a>\n <a class=\"code-anchor\" href=\"api/router/ExtraOptions#scrollPositionRestoration\"><span class=\"member-name\">scrollPositionRestoration</span>?: 'disabled' | 'enabled' | 'top'</a>\n <a class=\"code-anchor\" href=\"api/router/ExtraOptions#anchorScrolling\"><span class=\"member-name\">anchorScrolling</span>?: 'disabled' | 'enabled'</a>\n <a class=\"code-anchor\" href=\"api/router/ExtraOptions#scrollOffset\"><span class=\"member-name\">scrollOffset</span>?: [number, number] | (() => [number, number])</a>\n <a class=\"code-anchor\" href=\"api/router/ExtraOptions#paramsInheritanceStrategy\"><span class=\"member-name\">paramsInheritanceStrategy</span>?: 'emptyOnly' | 'always'</a>\n <a class=\"code-anchor\" href=\"api/router/ExtraOptions#malformedUriErrorHandler\"><span class=\"member-name\">malformedUriErrorHandler</span>?: (error: URIError, urlSerializer: UrlSerializer, url: string) => UrlTree</a>\n <a class=\"code-anchor\" href=\"api/router/ExtraOptions#urlUpdateStrategy\"><span class=\"member-name\">urlUpdateStrategy</span>?: 'deferred' | 'eager'</a>\n <a class=\"code-anchor\" href=\"api/router/ExtraOptions#relativeLinkResolution\"><span class=\"member-name\">relativeLinkResolution</span>?: 'legacy' | 'corrected'</a>\n}\n</code-example>\n\n \n \n\n\n \n \n\n</section>\n\n \n<section class=\"see-also\">\n <h2 id=\"see-also\">See also<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"api/router/ExtraOptions#see-also\"><i class=\"material-icons\">link</i></a></h2>\n <ul>\n \n <li><p><code>forRoot()</code></p>\n</li>\n </ul>\n</section>\n\n\n \n \n \n<section class=\"instance-properties\">\n <h2 id=\"properties\">Properties<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"api/router/ExtraOptions#properties\"><i class=\"material-icons\">link</i></a></h2>\n <table class=\"is-full-width list-table property-table\">\n <thead>\n <tr>\n <th>Property</th>\n <th>Description</th>\n </tr>\n </thead>\n <tbody>\n \n <tr class=\"instance-property\">\n <td>\n <a id=\"enableTracing\"></a>\n <code class=\"\"><span class=\"member-name\">enableTracing</span>?: boolean</code>\n </td>\n <td>\n \n <p>When true, log all internal navigation events to the console.\nUse for debugging.</p>\n\n \n </td>\n </tr>\n \n <tr class=\"instance-property\">\n <td>\n <a id=\"useHash\"></a>\n <code class=\"\"><span class=\"member-name\">useHash</span>?: boolean</code>\n </td>\n <td>\n \n <p>When true, enable the location strategy that uses the URL fragment\ninstead of the history API.</p>\n\n \n </td>\n </tr>\n \n <tr class=\"instance-property\">\n <td>\n <a id=\"initialNavigation\"></a>\n <code class=\"\"><span class=\"member-name\">initialNavigation</span>?: <a href=\"api/router/InitialNavigation\" class=\"code-anchor\">InitialNavigation</a></code>\n </td>\n <td>\n \n <p>One of <code>enabled</code>, <code>enabledBlocking</code>, <code>enabledNonBlocking</code> or <code>disabled</code>.\nWhen set to <code>enabled</code> or <code>enabledBlocking</code>, the initial navigation starts before the root\ncomponent is created. The bootstrap is blocked until the initial navigation is complete. This\nvalue is required for <a href=\"guide/universal\">server-side rendering</a> to work. When set to\n<code>enabledNonBlocking</code>, the initial navigation starts after the root component has been created.\nThe bootstrap is not blocked on the completion of the initial navigation. When set to\n<code>disabled</code>, the initial navigation is not performed. The location listener is set up before the\nroot component gets created. Use if there is a reason to have more control over when the router\nstarts its initial navigation due to some complex initialization logic.</p>\n\n \n </td>\n </tr>\n \n <tr class=\"instance-property\">\n <td>\n <a id=\"errorHandler\"></a>\n <code class=\"\"><span class=\"member-name\">errorHandler</span>?: <a href=\"api/core/ErrorHandler\" class=\"code-anchor\">ErrorHandler</a></code>\n </td>\n <td>\n \n <p>A custom error handler for failed navigations.\nIf the handler returns a value, the navigation Promise is resolved with this value.\nIf the handler throws an exception, the navigation Promise is rejected with the exception.</p>\n\n \n </td>\n </tr>\n \n <tr class=\"instance-property\">\n <td>\n <a id=\"preloadingStrategy\"></a>\n <code class=\"\"><span class=\"member-name\">preloadingStrategy</span>?: any</code>\n </td>\n <td>\n \n <p>Configures a preloading strategy.\nOne of <code><a href=\"api/router/PreloadAllModules\" class=\"code-anchor\">PreloadAllModules</a></code> or <code><a href=\"api/router/NoPreloading\" class=\"code-anchor\">NoPreloading</a></code> (the default).</p>\n\n \n </td>\n </tr>\n \n <tr class=\"instance-property\">\n <td>\n <a id=\"onSameUrlNavigation\"></a>\n <code class=\"\"><span class=\"member-name\">onSameUrlNavigation</span>?: 'reload' | 'ignore'</code>\n </td>\n <td>\n \n <p>Define what the router should do if it receives a navigation request to the current URL.\nDefault is <code>ignore</code>, which causes the router ignores the navigation.\nThis can disable features such as a \"refresh\" button.\nUse this option to configure the behavior when navigating to the\ncurrent URL. Default is 'ignore'.</p>\n\n \n </td>\n </tr>\n \n <tr class=\"instance-property\">\n <td>\n <a id=\"scrollPositionRestoration\"></a>\n <code class=\"\"><span class=\"member-name\">scrollPositionRestoration</span>?: 'disabled' | 'enabled' | 'top'</code>\n </td>\n <td>\n \n <p>Configures if the scroll position needs to be restored when navigating back.</p>\n\n <ul>\n<li>'disabled'- (Default) Does nothing. Scroll position is maintained on navigation.</li>\n<li>'top'- Sets the scroll position to x = 0, y = 0 on all navigation.</li>\n<li>'enabled'- Restores the previous scroll position on backward navigation, else sets the\nposition to the anchor if one is provided, or sets the scroll position to [0, 0] (forward\nnavigation). This option will be the default in the future.</li>\n</ul>\n<p>You can implement custom scroll restoration behavior by adapting the enabled behavior as\nin the following example.</p>\n<code-example language=\"typescript\">\nclass AppModule {\n constructor(router: <a href=\"api/router/Router\" class=\"code-anchor\">Router</a>, viewportScroller: <a href=\"api/common/ViewportScroller\" class=\"code-anchor\">ViewportScroller</a>) {\n router.events.pipe(\n filter((e: <a href=\"api/router/Event\" class=\"code-anchor\">Event</a>): e is <a href=\"api/router/Scroll\" class=\"code-anchor\">Scroll</a> => e instanceof <a href=\"api/router/Scroll\" class=\"code-anchor\">Scroll</a>)\n ).subscribe(e => {\n if (e.position) {\n // backward navigation\n viewportScroller.scrollToPosition(e.position);\n } else if (e.anchor) {\n // anchor navigation\n viewportScroller.scrollToAnchor(e.anchor);\n } else {\n // forward navigation\n viewportScroller.scrollToPosition([0, 0]);\n }\n });\n }\n}\n</code-example>\n\n </td>\n </tr>\n \n <tr class=\"instance-property\">\n <td>\n <a id=\"anchorScrolling\"></a>\n <code class=\"\"><span class=\"member-name\">anchorScrolling</span>?: 'disabled' | 'enabled'</code>\n </td>\n <td>\n \n <p>When set to 'enabled', scrolls to the anchor element when the URL has a fragment.\nAnchor scrolling is disabled by default.</p>\n\n <p>Anchor scrolling does not happen on 'popstate'. Instead, we restore the position\nthat we stored or scroll to the top.</p>\n\n </td>\n </tr>\n \n <tr class=\"instance-property\">\n <td>\n <a id=\"scrollOffset\"></a>\n <code class=\"\"><span class=\"member-name\">scrollOffset</span>?: [number, number] | (() => [number, number])</code>\n </td>\n <td>\n \n <p>Configures the scroll offset the router will use when scrolling to an element.</p>\n\n <p>When given a tuple with x and y position value,\nthe router uses that offset each time it scrolls.\nWhen given a function, the router invokes the function every time\nit restores scroll position.</p>\n\n </td>\n </tr>\n \n <tr class=\"instance-property\">\n <td>\n <a id=\"paramsInheritanceStrategy\"></a>\n <code class=\"\"><span class=\"member-name\">paramsInheritanceStrategy</span>?: 'emptyOnly' | 'always'</code>\n </td>\n <td>\n \n <p>Defines how the router merges parameters, data, and resolved data from parent to child\nroutes. By default ('emptyOnly'), inherits parent parameters only for\npath-less or component-less routes.</p>\n\n <p>Set to 'always' to enable unconditional inheritance of parent parameters.</p>\n<p>Note that when dealing with matrix parameters, \"parent\" refers to the parent <code><a href=\"api/router/Route\" class=\"code-anchor\">Route</a></code>\nconfig which does not necessarily mean the \"URL segment to the left\". When the <code><a href=\"api/router/Route\" class=\"code-anchor\">Route</a></code> <code>path</code>\ncontains multiple segments, the matrix parameters must appear on the last segment. For example,\nmatrix parameters for <code>{path: 'a/b', component: MyComp}</code> should appear as <code>a/b;foo=bar</code> and not\n<code>a;foo=bar/b</code>.</p>\n\n </td>\n </tr>\n \n <tr class=\"instance-property\">\n <td>\n <a id=\"malformedUriErrorHandler\"></a>\n <code class=\"\"><span class=\"member-name\">malformedUriErrorHandler</span>?: (error: URIError, urlSerializer: <a href=\"api/router/UrlSerializer\" class=\"code-anchor\">UrlSerializer</a>, url: string) => <a href=\"api/router/UrlTree\" class=\"code-anchor\">UrlTree</a></code>\n </td>\n <td>\n \n <p>A custom handler for malformed URI errors. The handler is invoked when <code>encodedURI</code> contains\ninvalid character sequences.\nThe default implementation is to redirect to the root URL, dropping\nany path or parameter information. The function takes three parameters:</p>\n\n <ul>\n<li><code>'URIError'</code> - Error thrown when parsing a bad URL.</li>\n<li><code>'<a href=\"api/router/UrlSerializer\" class=\"code-anchor\">UrlSerializer</a>'</code> - UrlSerializer that’s configured with the router.</li>\n<li><code>'url'</code> - The malformed URL that caused the URIError</li>\n</ul>\n\n </td>\n </tr>\n \n <tr class=\"instance-property\">\n <td>\n <a id=\"urlUpdateStrategy\"></a>\n <code class=\"\"><span class=\"member-name\">urlUpdateStrategy</span>?: 'deferred' | 'eager'</code>\n </td>\n <td>\n \n <p>Defines when the router updates the browser URL. By default ('deferred'),\nupdate after successful navigation.\nSet to 'eager' if prefer to update the URL at the beginning of navigation.\nUpdating the URL early allows you to handle a failure of navigation by\nshowing an error message with the URL that failed.</p>\n\n \n </td>\n </tr>\n \n <tr class=\"instance-property\">\n <td>\n <a id=\"relativeLinkResolution\"></a>\n <code class=\"\"><span class=\"member-name\">relativeLinkResolution</span>?: 'legacy' | 'corrected'</code>\n </td>\n <td>\n \n <p>Enables a bug fix that corrects relative link resolution in components with empty paths.\nExample:</p>\n\n <code-example>\nconst routes = [\n {\n path: '',\n component: ContainerComponent,\n children: [\n { path: 'a', component: AComponent },\n { path: 'b', component: BComponent },\n ]\n }\n];\n</code-example>\n<p>From the <code>ContainerComponent</code>, you should be able to navigate to <code>AComponent</code> using\nthe following <code><a href=\"api/router/RouterLink\" class=\"code-anchor\">routerLink</a></code>, but it will not work if <code>relativeLinkResolution</code> is set\nto <code>'legacy'</code>:</p>\n<p><code><a [<a href=\"api/router/RouterLink\" class=\"code-anchor\">routerLink</a>]=\"['./a']\">Link to A</a></code></p>\n<p>However, this will work:</p>\n<p><code><a [<a href=\"api/router/RouterLink\" class=\"code-anchor\">routerLink</a>]=\"['../a']\">Link to A</a></code></p>\n<p>In other words, you're required to use <code>../</code> rather than <code>./</code> when the relative link\nresolution is set to <code>'legacy'</code>.</p>\n<p>The default in v11 is <code>corrected</code>.</p>\n\n </td>\n </tr>\n \n </tbody>\n </table>\n</section>\n \n\n\n \n\n\n </div>\n</article>\n\n<!-- links to this doc:\n - api/router\n - api/router/InitialNavigation\n - api/router/ROUTER_CONFIGURATION\n - api/router/RouterModule\n - api/router/testing/RouterTestingModule\n - api/router/testing/setupTestingRouter\n-->\n<!-- links from this doc:\n - /api\n - api/common/ViewportScroller\n - api/core/ErrorHandler\n - api/router\n - api/router/Event\n - api/router/ExtraOptions#anchorScrolling\n - api/router/ExtraOptions#enableTracing\n - api/router/ExtraOptions#errorHandler\n - api/router/ExtraOptions#extraoptions\n - api/router/ExtraOptions#initialNavigation\n - api/router/ExtraOptions#malformedUriErrorHandler\n - api/router/ExtraOptions#onSameUrlNavigation\n - api/router/ExtraOptions#paramsInheritanceStrategy\n - api/router/ExtraOptions#preloadingStrategy\n - api/router/ExtraOptions#properties\n - api/router/ExtraOptions#relativeLinkResolution\n - api/router/ExtraOptions#scrollOffset\n - api/router/ExtraOptions#scrollPositionRestoration\n - api/router/ExtraOptions#see-also\n - api/router/ExtraOptions#urlUpdateStrategy\n - api/router/ExtraOptions#useHash\n - api/router/InitialNavigation\n - api/router/NoPreloading\n - api/router/PreloadAllModules\n - api/router/Route\n - api/router/Router\n - api/router/RouterLink\n - api/router/Scroll\n - api/router/UrlSerializer\n - api/router/UrlTree\n - guide/universal\n - https://github.com/angular/angular/edit/master/packages/router/src/router_module.ts?message=docs(router)%3A%20describe%20your%20change...#L246-L430\n - https://github.com/angular/angular/tree/12.0.0-next.7/packages/router/src/router_module.ts#L246-L430\n-->"
|
||
} |