diff --git a/public/docs/ts/latest/guide/router.jade b/public/docs/ts/latest/guide/router.jade index ec90c73b4b..842c5de07c 100644 --- a/public/docs/ts/latest/guide/router.jade +++ b/public/docs/ts/latest/guide/router.jade @@ -2659,26 +2659,25 @@ a#final-app :marked Parse it out. - * The first item in the array identifies the parent route ('/crisis-center'). + * The first item in the array identifies the parent route (`/crisis-center`). * There are no parameters for this parent route so you're done with it. * There is no default for the child route so you need to pick one. - * You're navigating to the `CrisisListComponent`, whose route path is '/', but you don't need to explicitly add the slash + * You're navigating to the `CrisisListComponent`, whose route path is `/`, but you don't need to explicitly add the slash * Voila! `['/crisis-center']`. - Take it a step further. - This time you'll build a link parameters array that navigates from the root of the application - down to the "Dragon Crisis". - - * The first item in the array identifies the parent route ('/crisis-center'). - * There are no parameters for this parent route so you're done with it. - * The second item identifies the child route for details about a particular crisis ('/:id'). - * The details child route requires an `id` route parameter - * You added the `id` of the *Dragon Crisis* as the second item in the array (`1`) - - It looks like this! + Take it a step further. Consider the following router link that + navigates from the root of the application down to the *Dragon Crisis*: +makeExcerpt('app/app.component.3.ts', 'Dragon-anchor', '') +:marked + * The first item in the array identifies the parent route (`/crisis-center`). + * There are no parameters for this parent route so you're done with it. + * The second item identifies the child route details about a particular crisis (`/:id`). + * The details child route requires an `id` route parameter. + * You added the `id` of the *Dragon Crisis* as the second item in the array (`1`). + * The resulting path is `/crisis-center/1`. + :marked If you wanted to, you could redefine the `AppComponent` template with *Crisis Center* routes exclusively: @@ -2707,7 +2706,7 @@ a#browser-url-styles Here's the *Crisis Center* URL in this "HTML 5 pushState" style: -code-example(format=".", language="bash"). +code-example(format="nocode"). localhost:3002/crisis-center/ :marked @@ -2716,7 +2715,7 @@ code-example(format=".", language="bash"). Routers can take advantage of this exception by composing in-application route URLs with hashes. Here's a "hash URL" that routes to the *Crisis Center* -code-example(format=".", language="bash"). +code-example(format="nocode"). localhost:3002/src/#/crisis-center/ :marked @@ -2780,13 +2779,10 @@ code-example(format=".", language="bash"). Those developers may still use HTML 5 URLs by taking two remedial steps: - 1. Provide the router with an appropriate `APP_BASE_HREF` value. + 1. Provide the router with an appropriate [APP_BASE_HREF][] value. 1. Use _root URLs_ for all web resources: css, images, scripts, and template html files. -.l-sub-section - :marked - Learn about the [APP_BASE_HREF](../api/common/index/APP_BASE_HREF-let.html) - in the API Guide. + [APP_BASE_HREF]: ../api/common/index/APP_BASE_HREF-let.html :marked ### *HashLocationStrategy*