docs(router): document new router and samples - phase 2

wardbell · wardbell · commit 2842058a3091 · 2016-05-03T15:51:24.000-06:00
diff --git a/public/docs/_examples/router-deprecated/e2e-spec.js b/public/docs/_examples/router-deprecated/e2e-spec.js
@@ -92,7 +92,8 @@ describe('Router', function () {
   function crisisCenterEdit(index, shouldSave) {
     var page = getPageStruct();
     var crisisEle, crisisText;
-    page.crisisHref.click().then(function () {
+    page.crisisHref.click()
+    .then(function () {
       crisisEle = page.crisisList.get(index);
       return crisisEle.getText();
     }).then(function (text) {
diff --git a/public/docs/_examples/router-deprecated/ts/app/app.component.1.ts b/public/docs/_examples/router-deprecated/ts/app/app.component.1.ts
@@ -14,7 +14,7 @@ import { HeroListComponent }     from './hero-list.component';
   selector: 'my-app',
 // #docregion template
   template: `
-    <h1>Component Router</h1>
+    <h1>Component Router (Deprecated)</h1>
     <nav>
       <a [routerLink]="['CrisisCenter']">Crisis Center</a>
       <a [routerLink]="['Heroes']">Heroes</a>
diff --git a/public/docs/_examples/router-deprecated/ts/app/app.component.2.ts b/public/docs/_examples/router-deprecated/ts/app/app.component.2.ts
@@ -26,7 +26,7 @@ import {HeroService}           from './heroes/hero.service';
 @Component({
   selector: 'my-app',
   template: `
-    <h1>Component Router</h1>
+    <h1>Component Router (Deprecated)</h1>
     <nav>
       <a [routerLink]="['CrisisCenter']">Crisis Center</a>
       <a [routerLink]="['Heroes']">Heroes</a>
diff --git a/public/docs/_examples/router-deprecated/ts/app/app.component.3.ts b/public/docs/_examples/router-deprecated/ts/app/app.component.3.ts
@@ -35,7 +35,7 @@ import {HeroService}           from './heroes/hero.service';
   */
 // #docregion template
   template: `
-    <h1 class="title">Component Router</h1>
+    <h1 class="title">Component Router (Deprecated)</h1>
     <nav>
       <a [routerLink]="['CrisisCenter', 'CrisisList']">Crisis Center</a>
       <a [routerLink]="['CrisisCenter', 'CrisisDetail', {id:1}]">Dragon Crisis</a>
diff --git a/public/docs/_examples/router-deprecated/ts/app/app.component.ts b/public/docs/_examples/router-deprecated/ts/app/app.component.ts
@@ -14,7 +14,7 @@ import {HeroService}           from './heroes/hero.service';
   selector: 'my-app',
 // #docregion template
   template: `
-    <h1 class="title">Component Router</h1>
+    <h1 class="title">Component Router (Deprecated)</h1>
     <nav>
       <a [routerLink]="['CrisisCenter']">Crisis Center</a>
       <a [routerLink]="['Heroes']">Heroes</a>
diff --git a/public/docs/_examples/router-deprecated/ts/index.1.html b/public/docs/_examples/router-deprecated/ts/index.1.html
@@ -5,7 +5,7 @@
      <!-- #docregion base-href -->
     <base href="/">
     <!-- #enddocregion base-href -->
-    <title>Router Sample v.1</title>
+    <title>Router (Deprecated) Sample v.1</title>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="styles.css">
diff --git a/public/docs/_examples/router-deprecated/ts/index.2.html b/public/docs/_examples/router-deprecated/ts/index.2.html
@@ -3,7 +3,7 @@
 <html>
   <head>
     <base href="/">
-    <title>Router Sample v.2</title>
+    <title>Router (Deprecated) Sample v.2</title>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="styles.css">
diff --git a/public/docs/_examples/router-deprecated/ts/index.3.html b/public/docs/_examples/router-deprecated/ts/index.3.html
@@ -3,7 +3,7 @@
 <html>
   <head>
     <base href="/">
-    <title>Router Sample v.3</title>
+    <title>Router (Deprecated) Sample v.3</title>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="styles.css">
diff --git a/public/docs/_examples/router-deprecated/ts/index.html b/public/docs/_examples/router-deprecated/ts/index.html
@@ -4,7 +4,7 @@
   <head>
     <!-- Set the base href -->
     <base href="/">
-    <title>Router Sample</title>
+    <title>Router (Deprecated) Sample</title>
     <meta charset="UTF-8">
     <meta name="viewport" content="width=device-width, initial-scale=1">
     <link rel="stylesheet" href="styles.css">
diff --git a/public/docs/_examples/router/e2e-spec.js b/public/docs/_examples/router/e2e-spec.js
@@ -92,7 +92,8 @@ describe('Router', function () {
   function crisisCenterEdit(index, shouldSave) {
     var page = getPageStruct();
     var crisisEle, crisisText;
-    page.crisisHref.click().then(function () {
+    page.crisisHref.click()
+    .then(function () {
       crisisEle = page.crisisList.get(index);
       return crisisEle.getText();
     }).then(function (text) {
diff --git a/public/docs/ts/latest/guide/router.jade b/public/docs/ts/latest/guide/router.jade
@@ -40,17 +40,17 @@ include ../_util-fns
     
   We'll learn many router details in this chapter which covers
 
-  * Setting the [base href](#base-href)
-  * Importing from the [router library](#import)
+  * setting the [base href](#base-href)
+  * importing from the [router library](#import)
   * [configuring a router](#route-config)
   * the [link parameters array](#link-parameters-array) that propels router navigation
   * navigating when the user clicks a data-bound [RouterLink](#router-link)
   * navigating under [program control](#navigate)
-  * embedding critical information in the URL with [route parameters](#route-parameters)
+  * embedding critical information in the URL with [positional parameters](#positional-parameters)
   * creating a [child router](#child-router) with its own routes
   * setting a [default route](#default)
   * confirming or canceling navigation with [router lifecycle hooks](#lifecycle-hooks)
-  * passing optional information in [query parameters](#query-parameters)
+  * passing optional information in [matrix parameters](#matrix-parameters)
   * choosing the "HTML5" or "hash" [URL style](#browser-url-styles)
 
   We proceed in phases marked by milestones building from a simple two-pager with placeholder views
@@ -604,7 +604,7 @@ code-example(format="." language="bash").
   This array is similar to the  *link parameters array* we met [earlier](#shell-template) in an anchor tag while
   binding to the `RouterLink` directive. This time we see it in code rather than in HTML.
   
-  <a id="route-parameters"></id>
+  <a id="positional-parameters"></id>
   ### Setting the route parameters object
 
   We're navigating to the `HeroDetailComponent` where we expect to see the details of the selected hero.
@@ -1013,13 +1013,13 @@ code-example(format="").
   `)
 
 
-<a id="query-parameters"></a>
+<a id="matrix-parameters"></a>
 <a id="query-parameter"></a>
 .l-main-section
 :marked
   ## Milestone #4: Query Parameters
   
-  We use [*route parameters*](#route-parameters) to specify a *required* parameterized value *within* the route URL
+  We use [*route parameters*](#positional-parameters) to specify a *required* parameterized value *within* the route URL
   as we do when navigating to the `HeroDetailComponent` in order to view-and-edit the hero with *id:15*.
 code-example(format="." language="bash").
   localhost:3000/hero/15
@@ -1060,7 +1060,7 @@ figure.image-display
   * the value is optional.
   * the value is complex and/or multi-variate.  
   
-  <a id="route-parameters-object"></a>
+  <a id="positional-parameters-object"></a>
   ### Route parameters object
   When navigating to the `HeroDetailComponent` we specified the `id` of the hero-to-edit in the 
   *route parameters object* and made it the second item of the [*link parameters array*](#link-parameters-array). 
