{
  "id": "api/router/RouterPreloader",
  "title": "RouterPreloader",
  "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/RouterPreloader\", \"name\": \"RouterPreloader\" } }\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_preloader.ts?message=docs(router)%3A%20describe%20your%20change...#L61-L137\" 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_preloader.ts#L61-L137\" 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=\"routerpreloader\">RouterPreloader<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"api/router/RouterPreloader#routerpreloader\"><i class=\"material-icons\">link</i></a></h1>\n    \n    <label class=\"api-type-label class\">class</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>The preloader optimistically loads all router configurations to\nmake navigations into lazily-loaded sections of the application faster.</p>\n\n    <p><a href=\"api/router/RouterPreloader#description\">See more...</a></p>\n  </section>\n  \n  \n  \n  <section class=\"class-overview\">\n<code-example language=\"ts\" hidecopy=\"true\">\nclass <a href=\"api/router/RouterPreloader\" class=\"code-anchor\">RouterPreloader</a> implements <a class=\"code-anchor\" href=\"api/core/OnDestroy\">OnDestroy</a> {\n  <a class=\"code-anchor\" href=\"api/router/RouterPreloader#setUpPreloading\"><span class=\"member-name\">setUpPreloading</span>(): void</a>\n  <a class=\"code-anchor\" href=\"api/router/RouterPreloader#preload\"><span class=\"member-name\">preload</span>(): Observable&#x3C;any></a>\n}\n</code-example>\n\n  \n  \n\n</section>\n\n\n  \n\n  \n  \n<section class=\"description\">\n  <h2 id=\"description\">Description<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"api/router/RouterPreloader#description\"><i class=\"material-icons\">link</i></a></h2>\n  <p>The preloader runs in the background. When the router bootstraps, the preloader\nstarts listening to all navigation events. After every such event, the preloader\nwill check if any configurations can be loaded lazily.</p>\n<p>If a route is protected by <code>canLoad</code> guards, the preloaded will not load it.</p>\n\n  \n</section>\n\n  \n\n\n\n\n\n\n\n\n\n\n\n\n<section class=\"instance-methods\">\n  <h2 id=\"methods\">Methods<a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"api/router/RouterPreloader#methods\"><i class=\"material-icons\">link</i></a></h2>\n  \n    <a id=\"setUpPreloading\"></a>\n<table class=\"is-full-width method-table instance-method\">\n  <thead><tr><th>\n    <div class=\"with-github-links\">\n    <h3 id=\"setuppreloading\">\n      setUpPreloading()\n      \n    <a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"api/router/RouterPreloader#setuppreloading\"><i class=\"material-icons\">link</i></a></h3>\n    <div class=\"github-links\">\n  <a href=\"https://github.com/angular/angular/edit/master/packages/router/src/router_preloader.ts?message=docs(router)%3A%20describe%20your%20change...#L87-L93\" 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_preloader.ts#L87-L93\" aria-label=\"View Source\" title=\"View Source\"><i class=\"material-icons\" aria-hidden=\"true\" role=\"img\">code</i></a>\n</div>\n    </div>\n  </th></tr></thead>\n  <tbody>\n    \n  \n    <tr>\n      <td>\n        <div class=\"overload-info\">\n  \n\n  <code-example language=\"ts\" hidecopy=\"true\" class=\"no-box api-heading\"><span class=\"member-name\">setUpPreloading</span>(): void</code-example>\n\n  \n\n  <h6 class=\"no-anchor\" id=\"parameters\">Parameters</h6>\n  <p>There are no parameters.</p>\n\n  \n  <h6 class=\"no-anchor\" id=\"returns\">Returns</h6>\n  <p><code>void</code></p>\n\n  \n\n\n  \n\n  \n</div>\n      </td>\n    </tr>\n  \n\n  \n\n  \n    </tbody>\n</table>\n\n  \n    <a id=\"preload\"></a>\n<table class=\"is-full-width method-table instance-method\">\n  <thead><tr><th>\n    <div class=\"with-github-links\">\n    <h3 id=\"preload\">\n      preload()\n      \n    <a title=\"Link to this heading\" class=\"header-link\" aria-hidden=\"true\" href=\"api/router/RouterPreloader#preload\"><i class=\"material-icons\">link</i></a></h3>\n    <div class=\"github-links\">\n  <a href=\"https://github.com/angular/angular/edit/master/packages/router/src/router_preloader.ts?message=docs(router)%3A%20describe%20your%20change...#L94-L98\" 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_preloader.ts#L94-L98\" aria-label=\"View Source\" title=\"View Source\"><i class=\"material-icons\" aria-hidden=\"true\" role=\"img\">code</i></a>\n</div>\n    </div>\n  </th></tr></thead>\n  <tbody>\n    \n  \n    <tr>\n      <td>\n        <div class=\"overload-info\">\n  \n\n  <code-example language=\"ts\" hidecopy=\"true\" class=\"no-box api-heading\"><span class=\"member-name\">preload</span>(): Observable&#x3C;any></code-example>\n\n  \n\n  <h6 class=\"no-anchor\" id=\"parameters-1\">Parameters</h6>\n  <p>There are no parameters.</p>\n\n  \n  <h6 class=\"no-anchor\" id=\"returns-1\">Returns</h6>\n  <p><code>Observable&#x3C;any></code></p>\n\n  \n\n\n  \n\n  \n</div>\n      </td>\n    </tr>\n  \n\n  \n\n  \n    </tbody>\n</table>\n\n  \n</section>\n\n\n\n  \n\n\n  </div>\n</article>\n\n<!-- links to this doc:\n - api/core/OnDestroy\n - api/router\n-->\n<!-- links from this doc:\n - /api\n - api/core/OnDestroy\n - api/router\n - api/router/RouterPreloader#description\n - api/router/RouterPreloader#methods\n - api/router/RouterPreloader#preload\n - api/router/RouterPreloader#routerpreloader\n - api/router/RouterPreloader#setUpPreloading\n - api/router/RouterPreloader#setuppreloading\n - https://github.com/angular/angular/edit/master/packages/router/src/router_preloader.ts?message=docs(router)%3A%20describe%20your%20change...#L61-L137\n - https://github.com/angular/angular/edit/master/packages/router/src/router_preloader.ts?message=docs(router)%3A%20describe%20your%20change...#L87-L93\n - https://github.com/angular/angular/edit/master/packages/router/src/router_preloader.ts?message=docs(router)%3A%20describe%20your%20change...#L94-L98\n - https://github.com/angular/angular/tree/12.0.0-next.7/packages/router/src/router_preloader.ts#L61-L137\n - https://github.com/angular/angular/tree/12.0.0-next.7/packages/router/src/router_preloader.ts#L87-L93\n - https://github.com/angular/angular/tree/12.0.0-next.7/packages/router/src/router_preloader.ts#L94-L98\n-->"
}