docs(router): Updated docs to reflect alpha 7 release

brandonroberts · naomiblack · commit 4e7318552d43 · 2016-06-20T16:55:07.000-07:00
diff --git a/public/docs/_examples/package.json b/public/docs/_examples/package.json
@@ -31,7 +31,7 @@
     "@angular/http": "2.0.0-rc.2",
     "@angular/platform-browser": "2.0.0-rc.2",
     "@angular/platform-browser-dynamic": "2.0.0-rc.2",
-    "@angular/router": "2.0.0-rc.2",
+    "@angular/router": "3.0.0-alpha.7",
     "@angular/router-deprecated": "2.0.0-rc.2",
     "@angular/upgrade": "2.0.0-rc.2",
     "angular2-in-memory-web-api": "0.0.12",
diff --git a/public/docs/_examples/router/e2e-spec.ts b/public/docs/_examples/router/e2e-spec.ts
@@ -24,14 +24,18 @@ describe('Router', function () {
       heroDetail: element(by.css('my-app > undefined > div')),
       heroDetailTitle: element(by.css('my-app > undefined > div > h3')),
 
+      adminHref: hrefEles.get(2),
+      loginHref: hrefEles.get(3)
     };
   }
 
   it('should be able to see the start screen', function () {
     let page = getPageStruct();
-    expect(page.hrefs.count()).toEqual(2, 'should be two dashboard choices');
+    expect(page.hrefs.count()).toEqual(4, 'should be two dashboard choices');
     expect(page.crisisHref.getText()).toEqual('Crisis Center');
     expect(page.heroesHref.getText()).toEqual('Heroes');
+    expect(page.adminHref.getText()).toEqual('Crisis Admin');
+    expect(page.loginHref.getText()).toEqual('Login');
   });
 
   it('should be able to see crises center items', function () {
diff --git a/public/docs/_examples/router/ts/app/app.component.2.ts b/public/docs/_examples/router/ts/app/app.component.2.ts
@@ -3,7 +3,7 @@
 
 // #docregion
 import { Component }                 from '@angular/core';
-import { Router, ROUTER_DIRECTIVES } from '@angular/router';
+import { ROUTER_DIRECTIVES } from '@angular/router';
 
 // #enddocregion
 /*
diff --git a/public/docs/_examples/router/ts/app/app.routes.1.ts b/public/docs/_examples/router/ts/app/app.routes.1.ts
@@ -16,11 +16,11 @@ import { HeroDetailComponent } from './heroes/hero-detail.component';
 // #docregion route-config
 export const routes: RouterConfig = [
   // #docregion route-defs
-  { path: '/crisis-center', component: CrisisCenterComponent },
-  { path: '/heroes', component: HeroListComponent },
+  { path: 'crisis-center', component: CrisisCenterComponent },
+  { path: 'heroes', component: HeroListComponent },
   // #enddocregion route-defs
   // #docregion hero-detail-route
-  { path: '/hero/:id', component: HeroDetailComponent }
+  { path: 'hero/:id', component: HeroDetailComponent }
   // #enddocregion hero-detail-route
 ];
 
diff --git a/public/docs/_examples/router/ts/app/app.routes.2.ts b/public/docs/_examples/router/ts/app/app.routes.2.ts
@@ -9,8 +9,8 @@ import { HeroListComponent }    from './hero-list.component';
 
 // #docregion route-config
 export const routes: RouterConfig = [
-  { path: '/crisis-center', component: CrisisListComponent },
-  { path: '/heroes', component: HeroListComponent }
+  { path: 'crisis-center', component: CrisisListComponent },
+  { path: 'heroes', component: HeroListComponent }
 ];
 
 export const APP_ROUTER_PROVIDERS = [
diff --git a/public/docs/_examples/router/ts/app/app.routes.3.ts b/public/docs/_examples/router/ts/app/app.routes.3.ts
@@ -7,7 +7,7 @@ import { HeroesRoutes }        from './heroes/heroes.routes';
 
 export const routes = [
   ...HeroesRoutes,
-  { path: '/crisis-center', component: CrisisListComponent }
+  { path: 'crisis-center', component: CrisisListComponent }
 ];
 
 export const APP_ROUTER_PROVIDERS = [
diff --git a/public/docs/_examples/router/ts/app/crisis-center/crisis-center.routes.1.ts b/public/docs/_examples/router/ts/app/crisis-center/crisis-center.routes.1.ts
@@ -7,11 +7,11 @@ import { CrisisCenterComponent } from './crisis-center.component';
 // #docregion routes
 export const CrisisCenterRoutes: RouterConfig = [
   {
-    path: '/crisis-center',
+    path: 'crisis-center',
     component: CrisisCenterComponent,
     children: [
-      { path: '/',    component: CrisisListComponent },
-      { path: '/:id', component: CrisisDetailComponent }
+      { path: ':id',  component: CrisisDetailComponent },
+      { path: '',     component: CrisisListComponent }
     ]
   }
 ];
diff --git a/public/docs/_examples/router/ts/app/crisis-center/crisis-center.routes.2.ts b/public/docs/_examples/router/ts/app/crisis-center/crisis-center.routes.2.ts
@@ -6,17 +6,20 @@ import { CrisisCenterComponent } from './crisis-center.component';
 
 // #docregion routes
 export const CrisisCenterRoutes: RouterConfig = [
+  // #docregion redirect
   {
-    path: '/crisis-center',
+    path: '',
+    redirectTo: '/crisis-center',
+    terminal: true
+  },
+  // #enddocregion redirect
+  {
+    path: 'crisis-center',
     component: CrisisCenterComponent,
-    index: true,
     children: [
-      { path: '/:id',  component: CrisisDetailComponent },
-      { path: '/',     component: CrisisListComponent,
-        index: true
-      }
+      { path: ':id',  component: CrisisDetailComponent },
+      { path: '',     component: CrisisListComponent }
     ]
   }
 ];
 // #enddocregion routes
-
diff --git a/public/docs/_examples/router/ts/app/crisis-center/crisis-center.routes.3.ts b/public/docs/_examples/router/ts/app/crisis-center/crisis-center.routes.3.ts
@@ -10,25 +10,28 @@ import { CanDeactivateGuard }    from '../interfaces';
 
 export const CrisisCenterRoutes: RouterConfig = [
   {
-    path: '/crisis-center',
+    path: '',
+    redirectTo: '/crisis-center',
+    terminal: true
+  },
+  {
+    path: 'crisis-center',
     component: CrisisCenterComponent,
-    index: true,
     children: [
       // #docregion admin-route-no-guard
       {
-        path: '/admin',
+        path: 'admin',
         component: CrisisAdminComponent
       },
       // #enddocregion admin-route-no-guard
       {
-        path: '/:id',
+        path: ':id',
         component: CrisisDetailComponent,
         canDeactivate: [CanDeactivateGuard]
       },
       {
-        path: '/',
-        component: CrisisListComponent,
-        index: true
+        path: '',
+        component: CrisisListComponent
       }
     ]
   }
@@ -40,7 +43,7 @@ export const CrisisCenterRoutes: RouterConfig = [
 import { AuthGuard }             from '../auth.guard';
 
 {
-  path: '/admin',
+  path: 'admin',
   component: CrisisAdminComponent,
   canActivate: [AuthGuard]
 }
diff --git a/public/docs/_examples/router/ts/app/crisis-center/crisis-center.routes.4.ts b/public/docs/_examples/router/ts/app/crisis-center/crisis-center.routes.4.ts
@@ -11,25 +11,28 @@ import { AuthGuard }             from '../auth.guard';
 
 export const CrisisCenterRoutes: RouterConfig = [
   {
-    path: '/crisis-center',
+    path: '',
+    redirectTo: '/crisis-center',
+    terminal: true
+  },
+  {
+    path: 'crisis-center',
     component: CrisisCenterComponent,
-    index: true,
     children: [
       {
-        path: '/admin',
+        path: 'admin',
         component: CrisisAdminComponent,
         canActivate: [AuthGuard]
       },
       {
-        path: '/:id',
+        path: ':id',
         component: CrisisDetailComponent,
         canDeactivate: [CanDeactivateGuard]
       },
       // #docregion default-route
       {
-        path: '/',
-        component: CrisisListComponent,
-        index: true
+        path: '',
+        component: CrisisListComponent
       }
       // #enddocregion default-route
     ]
@@ -42,7 +45,7 @@ export const CrisisCenterRoutes: RouterConfig = [
 import { AuthGuard }             from '../auth.guard';
 
 {
-  path: '/admin',
+  path: 'admin',
   component: CrisisAdminComponent,
   canActivate: [AuthGuard]
 }
diff --git a/public/docs/_examples/router/ts/app/crisis-center/crisis-center.routes.ts b/public/docs/_examples/router/ts/app/crisis-center/crisis-center.routes.ts
@@ -10,25 +10,29 @@ import { AuthGuard }             from '../auth.guard';
 
 export const CrisisCenterRoutes: RouterConfig = [
   {
-    path: '/crisis-center',
+    path: '',
+    redirectTo: '/crisis-center',
+    terminal: true
+  },
+  {
+    path: 'crisis-center',
     component: CrisisCenterComponent,
-    index: true,
     children: [
       // #docregion admin-route
       {
-        path: '/admin',
+        path: 'admin',
         component: CrisisAdminComponent,
         canActivate: [AuthGuard]
       },
       // #enddocregion admin-route
       {
-        path: '/:id',
+        path: ':id',
         component: CrisisDetailComponent,
         canDeactivate: [CanDeactivateGuard]
       },
-      { path: '/',
-        component: CrisisListComponent,
-        index: true
+      {
+        path: '',
+        component: CrisisListComponent
       }
     ]
   }
diff --git a/public/docs/_examples/router/ts/app/crisis-center/crisis.service.ts b/public/docs/_examples/router/ts/app/crisis-center/crisis.service.ts
@@ -14,7 +14,7 @@ const CRISES = [
 let crisesPromise = Promise.resolve(CRISES);
 
 // #docregion
-import {Injectable} from '@angular/core';
+import { Injectable } from '@angular/core';
 
 @Injectable()
 export class CrisisService {
diff --git a/public/docs/_examples/router/ts/app/heroes/hero-detail.component.ts b/public/docs/_examples/router/ts/app/heroes/hero-detail.component.ts
@@ -56,7 +56,7 @@ export class HeroDetailComponent implements OnInit, OnDestroy  {
     let heroId = this.hero ? this.hero.id : null;
     // Pass along the hero id if available
     // so that the HeroList component can select that hero.
-    this.router.navigate(['/heroes'], { queryParams: { id: `${heroId}`, foo: 'foo' } });
+    this.router.navigate(['/heroes'], { queryParams: { id: heroId, foo: 'foo' } });
   }
   // #enddocregion gotoHeroes-navigate
 }
diff --git a/public/docs/_examples/router/ts/app/heroes/heroes.routes.ts b/public/docs/_examples/router/ts/app/heroes/heroes.routes.ts
@@ -4,9 +4,9 @@ import { HeroListComponent }     from './hero-list.component';
 import { HeroDetailComponent }   from './hero-detail.component';
 
 export const HeroesRoutes: RouterConfig = [
-  { path: '/heroes',  component: HeroListComponent },
+  { path: 'heroes',  component: HeroListComponent },
 // #docregion hero-detail-route
-  { path: '/hero/:id', component: HeroDetailComponent }
+  { path: 'hero/:id', component: HeroDetailComponent }
 // #enddocregion hero-detail-route
 ];
 // #enddocregion
diff --git a/public/docs/_examples/router/ts/app/login.component.ts b/public/docs/_examples/router/ts/app/login.component.ts
@@ -4,7 +4,6 @@ import { Router }      from '@angular/router';
 import { AuthService } from './auth.service';
 
 @Component({
-  selector: 'login',
   template: `
     <h2>LOGIN</h2>
     <p>{{message}}</p>
@@ -25,7 +24,7 @@ export class LoginComponent {
   }
 
   login() {
-    this.message = "Trying to log in ...";
+    this.message = 'Trying to log in ...';
 
     this.authService.login().subscribe(() => {
       this.setMessage();
diff --git a/public/docs/_examples/router/ts/app/login.routes.ts b/public/docs/_examples/router/ts/app/login.routes.ts
@@ -4,7 +4,7 @@ import { AuthService }        from './auth.service';
 import { LoginComponent }     from './login.component';
 
 export const LoginRoutes = [
-  { path: '/login', component: LoginComponent }
+  { path: 'login', component: LoginComponent }
 ];
 
 export const AUTH_PROVIDERS = [AuthGuard, AuthService];
diff --git a/public/docs/_examples/systemjs.config.plunker.js b/public/docs/_examples/systemjs.config.plunker.js
@@ -6,7 +6,7 @@
 (function(global) {
 
   var ngVer = '@2.0.0-rc.2'; // lock in the angular package version; do not let it float to current!
-  var routerVer = '@3.0.0-alpha.3'; // lock router version
+  var routerVer = '@3.0.0-alpha.7'; // lock router version
 
   //map tells the System loader where to look for things
   var  map = {
diff --git a/public/docs/ts/latest/guide/router.jade b/public/docs/ts/latest/guide/router.jade

Original file line number	Diff line number	Diff line change
`@@ -7,11 +7,11 @@ import { CrisisCenterComponent } from './crisis-center.component';`
`7`	`7`	`// #docregion routes`
`8`	`8`	`export const CrisisCenterRoutes: RouterConfig = [`
`9`	`9`	`{`
`10`		`- path: '/crisis-center',`
	`10`	`+ path: 'crisis-center',`
`11`	`11`	`component: CrisisCenterComponent,`
`12`	`12`	`children: [`
`13`		`- { path: '/', component: CrisisListComponent },`
`14`		`- { path: '/:id', component: CrisisDetailComponent }`
	`13`	`+ { path: ':id', component: CrisisDetailComponent },`
	`14`	`+ { path: '', component: CrisisListComponent }`
`15`	`15`	`]`
`16`	`16`	`}`
`17`	`17`	`];`
Original file line number	Diff line number	Diff line change
`@@ -10,25 +10,28 @@ import { CanDeactivateGuard } from '../interfaces';`
`10`	`10`
`11`	`11`	`export const CrisisCenterRoutes: RouterConfig = [`
`12`	`12`	`{`
`13`		`- path: '/crisis-center',`
	`13`	`+ path: '',`
	`14`	`+ redirectTo: '/crisis-center',`
	`15`	`+ terminal: true`
	`16`	`+ },`
	`17`	`+ {`
	`18`	`+ path: 'crisis-center',`
`14`	`19`	`component: CrisisCenterComponent,`
`15`		`- index: true,`
`16`	`20`	`children: [`
`17`	`21`	`// #docregion admin-route-no-guard`
`18`	`22`	`{`
`19`		`- path: '/admin',`
	`23`	`+ path: 'admin',`
`20`	`24`	`component: CrisisAdminComponent`
`21`	`25`	`},`
`22`	`26`	`// #enddocregion admin-route-no-guard`
`23`	`27`	`{`
`24`		`- path: '/:id',`
	`28`	`+ path: ':id',`
`25`	`29`	`component: CrisisDetailComponent,`
`26`	`30`	`canDeactivate: [CanDeactivateGuard]`
`27`	`31`	`},`
`28`	`32`	`{`
`29`		`- path: '/',`
`30`		`- component: CrisisListComponent,`
`31`		`- index: true`
	`33`	`+ path: '',`
	`34`	`+ component: CrisisListComponent`
`32`	`35`	`}`
`33`	`36`	`]`
`34`	`37`	`}`
`@@ -40,7 +43,7 @@ export const CrisisCenterRoutes: RouterConfig = [`
`40`	`43`	`import { AuthGuard } from '../auth.guard';`
`41`	`44`
`42`	`45`	`{`
`43`		`- path: '/admin',`
	`46`	`+ path: 'admin',`
`44`	`47`	`component: CrisisAdminComponent,`
`45`	`48`	`canActivate: [AuthGuard]`
`46`	`49`	`}`
Original file line number	Diff line number	Diff line change
`@@ -11,25 +11,28 @@ import { AuthGuard } from '../auth.guard';`
`11`	`11`
`12`	`12`	`export const CrisisCenterRoutes: RouterConfig = [`
`13`	`13`	`{`
`14`		`- path: '/crisis-center',`
	`14`	`+ path: '',`
	`15`	`+ redirectTo: '/crisis-center',`
	`16`	`+ terminal: true`
	`17`	`+ },`
	`18`	`+ {`
	`19`	`+ path: 'crisis-center',`
`15`	`20`	`component: CrisisCenterComponent,`
`16`		`- index: true,`
`17`	`21`	`children: [`
`18`	`22`	`{`
`19`		`- path: '/admin',`
	`23`	`+ path: 'admin',`
`20`	`24`	`component: CrisisAdminComponent,`
`21`	`25`	`canActivate: [AuthGuard]`
`22`	`26`	`},`
`23`	`27`	`{`
`24`		`- path: '/:id',`
	`28`	`+ path: ':id',`
`25`	`29`	`component: CrisisDetailComponent,`
`26`	`30`	`canDeactivate: [CanDeactivateGuard]`
`27`	`31`	`},`
`28`	`32`	`// #docregion default-route`
`29`	`33`	`{`
`30`		`- path: '/',`
`31`		`- component: CrisisListComponent,`
`32`		`- index: true`
	`34`	`+ path: '',`
	`35`	`+ component: CrisisListComponent`
`33`	`36`	`}`
`34`	`37`	`// #enddocregion default-route`
`35`	`38`	`]`
`@@ -42,7 +45,7 @@ export const CrisisCenterRoutes: RouterConfig = [`
`42`	`45`	`import { AuthGuard } from '../auth.guard';`
`43`	`46`
`44`	`47`	`{`
`45`		`- path: '/admin',`
	`48`	`+ path: 'admin',`
`46`	`49`	`component: CrisisAdminComponent,`
`47`	`50`	`canActivate: [AuthGuard]`
`48`	`51`	`}`
Original file line number	Diff line number	Diff line change
`@@ -56,7 +56,7 @@ export class HeroDetailComponent implements OnInit, OnDestroy {`
`56`	`56`	`let heroId = this.hero ? this.hero.id : null;`
`57`	`57`	`// Pass along the hero id if available`
`58`	`58`	`// so that the HeroList component can select that hero.`
`59`		- this.router.navigate(['/heroes'], { queryParams: { id: `${heroId}`, foo: 'foo' } });
	`59`	`+ this.router.navigate(['/heroes'], { queryParams: { id: heroId, foo: 'foo' } });`
`60`	`60`	`}`
`61`	`61`	`// #enddocregion gotoHeroes-navigate`
`62`	`62`	`}`