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 index 27bdf610cb..e4685ff418 100644 --- a/public/docs/_examples/router-deprecated/ts/app/app.component.2.ts +++ b/public/docs/_examples/router-deprecated/ts/app/app.component.2.ts @@ -2,25 +2,25 @@ // #docplaster // #docregion -import {Component} from '@angular/core'; -import {RouteConfig, ROUTER_DIRECTIVES} from '@angular/router-deprecated'; +import { Component } from '@angular/core'; +import { RouteConfig, ROUTER_DIRECTIVES } from '@angular/router-deprecated'; -import {CrisisListComponent} from './crisis-list.component'; +import { CrisisListComponent } from './crisis-list.component'; // #enddocregion /* // Apparent Milestone 2 imports // #docregion // #docregion hero-import -import {HeroListComponent} from './heroes/hero-list.component'; -import {HeroDetailComponent} from './heroes/hero-detail.component'; -import {HeroService} from './heroes/hero.service'; +import { HeroListComponent } from './heroes/hero-list.component'; +import { HeroDetailComponent } from './heroes/hero-detail.component'; +import { HeroService } from './heroes/hero.service'; // #enddocregion hero-import // #enddocregion */ // Actual Milestone 2 imports -import {HeroListComponent} from './heroes/hero-list.component.1'; -import {HeroDetailComponent} from './heroes/hero-detail.component.1'; -import {HeroService} from './heroes/hero.service'; +import { HeroListComponent } from './heroes/hero-list.component.1'; +import { HeroDetailComponent } from './heroes/hero-detail.component.1'; +import { HeroService } from './heroes/hero.service'; // #docregion @Component({ 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 index 199c9a199b..68635e8aad 100644 --- a/public/docs/_examples/router-deprecated/ts/app/app.component.3.ts +++ b/public/docs/_examples/router-deprecated/ts/app/app.component.3.ts @@ -1,11 +1,10 @@ // #docplaster -import {Component} from '@angular/core'; -import {RouteConfig, ROUTER_DIRECTIVES} from '@angular/router-deprecated'; +import { Component } from '@angular/core'; +import { RouteConfig, ROUTER_DIRECTIVES } from '@angular/router-deprecated'; -import {CrisisCenterComponent} from './crisis-center/crisis-center.component.1'; - -import {DialogService} from './dialog.service'; -import {HeroService} from './heroes/hero.service'; +import { CrisisCenterComponent } from './crisis-center/crisis-center.component.1'; +import { DialogService } from './dialog.service'; +import { HeroService } from './heroes/hero.service'; @Component({ selector: 'my-app', diff --git a/public/docs/_examples/router-deprecated/ts/app/app.component.ts b/public/docs/_examples/router-deprecated/ts/app/app.component.ts index 459d52fc76..a6f784cda9 100644 --- a/public/docs/_examples/router-deprecated/ts/app/app.component.ts +++ b/public/docs/_examples/router-deprecated/ts/app/app.component.ts @@ -1,14 +1,14 @@ // #docplaster // #docregion -import {Component} from '@angular/core'; -import {RouteConfig, ROUTER_DIRECTIVES} from '@angular/router-deprecated'; +import { Component } from '@angular/core'; +import { RouteConfig, ROUTER_DIRECTIVES } from '@angular/router-deprecated'; -import {CrisisCenterComponent} from './crisis-center/crisis-center.component'; -import {HeroListComponent} from './heroes/hero-list.component'; -import {HeroDetailComponent} from './heroes/hero-detail.component'; +import { CrisisCenterComponent } from './crisis-center/crisis-center.component'; +import { HeroListComponent } from './heroes/hero-list.component'; +import { HeroDetailComponent } from './heroes/hero-detail.component'; -import {DialogService} from './dialog.service'; -import {HeroService} from './heroes/hero.service'; +import { DialogService } from './dialog.service'; +import { HeroService } from './heroes/hero.service'; @Component({ selector: 'my-app', diff --git a/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-center.component.1.ts b/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-center.component.1.ts index 027d8df037..496b8ba11e 100644 --- a/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-center.component.1.ts +++ b/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-center.component.1.ts @@ -1,9 +1,9 @@ -import {Component} from '@angular/core'; -import {RouteConfig, RouterOutlet} from '@angular/router-deprecated'; +import { Component } from '@angular/core'; +import { RouteConfig, RouterOutlet } from '@angular/router-deprecated'; -import {CrisisListComponent} from './crisis-list.component.1'; -import {CrisisDetailComponent} from './crisis-detail.component.1'; -import {CrisisService} from './crisis.service'; +import { CrisisListComponent } from './crisis-list.component.1'; +import { CrisisDetailComponent } from './crisis-detail.component.1'; +import { CrisisService } from './crisis.service'; // #docregion minus-imports @Component({ diff --git a/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-center.component.ts b/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-center.component.ts index 77060d936b..27f9ff09ac 100644 --- a/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-center.component.ts +++ b/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-center.component.ts @@ -1,10 +1,10 @@ // #docregion -import {Component} from '@angular/core'; -import {RouteConfig, RouterOutlet} from '@angular/router-deprecated'; +import { Component } from '@angular/core'; +import { RouteConfig, RouterOutlet } from '@angular/router-deprecated'; -import {CrisisListComponent} from './crisis-list.component'; -import {CrisisDetailComponent} from './crisis-detail.component'; -import {CrisisService} from './crisis.service'; +import { CrisisListComponent } from './crisis-list.component'; +import { CrisisDetailComponent } from './crisis-detail.component'; +import { CrisisService } from './crisis.service'; @Component({ template: ` diff --git a/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-detail.component.1.ts b/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-detail.component.1.ts index f92180e462..8fb93b371a 100644 --- a/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-detail.component.1.ts +++ b/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-detail.component.1.ts @@ -1,14 +1,15 @@ // #docplaster // #docregion -import {Component, OnInit} from '@angular/core'; -import {Crisis, CrisisService} from './crisis.service'; -import {RouteParams, Router} from '@angular/router-deprecated'; +import { Component, OnInit } from '@angular/core'; +import { RouteParams, Router } from '@angular/router-deprecated'; // #docregion routerCanDeactivate -import {CanDeactivate, ComponentInstruction} from '@angular/router-deprecated'; -import {DialogService} from '../dialog.service'; +import { CanDeactivate, ComponentInstruction } from '@angular/router-deprecated'; + +import { DialogService } from '../dialog.service'; // #enddocregion routerCanDeactivate +import { Crisis, CrisisService } from './crisis.service'; @Component({ // #docregion template @@ -38,16 +39,16 @@ export class CrisisDetailComponent implements OnInit, CanDeactivate { // #enddocregion routerCanDeactivate, cancel-save constructor( - private _service: CrisisService, - private _router: Router, - private _routeParams: RouteParams, - private _dialog: DialogService + private service: CrisisService, + private router: Router, + private routeParams: RouteParams, + private dialog: DialogService ) { } // #docregion ngOnInit ngOnInit() { - let id = +this._routeParams.get('id'); - this._service.getCrisis(id).then(crisis => { + let id = +this.routeParams.get('id'); + this.service.getCrisis(id).then(crisis => { if (crisis) { this.editName = crisis.name; this.crisis = crisis; @@ -66,7 +67,7 @@ export class CrisisDetailComponent implements OnInit, CanDeactivate { } // Otherwise ask the user with the dialog service and return its // promise which resolves to true or false when the user decides - return this._dialog.confirm('Discard changes?'); + return this.dialog.confirm('Discard changes?'); } // #enddocregion routerCanDeactivate @@ -85,7 +86,7 @@ export class CrisisDetailComponent implements OnInit, CanDeactivate { // #docregion gotoCrises gotoCrises() { // Like Crisis Center { + let id = +this.routeParams.get('id'); + this.service.getCrisis(id).then(crisis => { if (crisis) { this.editName = crisis.name; this.crisis = crisis; @@ -77,7 +78,7 @@ export class CrisisDetailComponent implements OnInit, CanDeactivate { // so that the CrisisListComponent can select that hero. // Add a totally useless `foo` parameter for kicks. // #docregion gotoCrises-navigate - this._router.navigate(['CrisisList', {id: crisisId, foo: 'foo'} ]); + this.router.navigate(['CrisisList', {id: crisisId, foo: 'foo'} ]); // #enddocregion gotoCrises-navigate } // #enddocregion gotoCrises diff --git a/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-list.component.1.ts b/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-list.component.1.ts index f2fa9c770c..45121da69e 100644 --- a/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-list.component.1.ts +++ b/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-list.component.1.ts @@ -1,9 +1,10 @@ // #docplaster // #docregion -import {Component, OnInit} from '@angular/core'; -import {Crisis, CrisisService} from './crisis.service'; -import {Router} from '@angular/router-deprecated'; +import { Component, OnInit } from '@angular/core'; +import { Router } from '@angular/router-deprecated'; + +import { Crisis, CrisisService } from './crisis.service'; @Component({ // #docregion template @@ -21,16 +22,16 @@ export class CrisisListComponent implements OnInit { crises: Crisis[]; constructor( - private _service: CrisisService, - private _router: Router) {} + private service: CrisisService, + private router: Router) {} ngOnInit() { - this._service.getCrises().then(crises => this.crises = crises); + this.service.getCrises().then(crises => this.crises = crises); } // #docregion select onSelect(crisis: Crisis) { - this._router.navigate(['CrisisDetail', { id: crisis.id }] ); + this.router.navigate(['CrisisDetail', { id: crisis.id }] ); } // #enddocregion select } diff --git a/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-list.component.ts b/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-list.component.ts index 3a6128302f..a5770d256f 100644 --- a/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-list.component.ts +++ b/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis-list.component.ts @@ -1,9 +1,10 @@ // #docplaster // #docregion -import {Component, OnInit} from '@angular/core'; -import {Crisis, CrisisService} from './crisis.service'; -import {Router, RouteParams} from '@angular/router-deprecated'; +import { Component, OnInit } from '@angular/core'; +import { RouteParams, Router } from '@angular/router-deprecated'; + +import { Crisis, CrisisService } from './crisis.service'; @Component({ template: ` @@ -19,22 +20,22 @@ import {Router, RouteParams} from '@angular/router-deprecated'; export class CrisisListComponent implements OnInit { crises: Crisis[]; - private _selectedId: number; + private selectedId: number; constructor( - private _service: CrisisService, - private _router: Router, + private service: CrisisService, + private router: Router, routeParams: RouteParams) { - this._selectedId = +routeParams.get('id'); + this.selectedId = +routeParams.get('id'); } - isSelected(crisis: Crisis) { return crisis.id === this._selectedId; } + isSelected(crisis: Crisis) { return crisis.id === this.selectedId; } ngOnInit() { - this._service.getCrises().then(crises => this.crises = crises); + this.service.getCrises().then(crises => this.crises = crises); } onSelect(crisis: Crisis) { - this._router.navigate( ['CrisisDetail', { id: crisis.id }] ); + this.router.navigate( ['CrisisDetail', { id: crisis.id }] ); } } diff --git a/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis.service.ts b/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis.service.ts index c71827a656..949ccd4e00 100644 --- a/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis.service.ts +++ b/public/docs/_examples/router-deprecated/ts/app/crisis-center/crisis.service.ts @@ -1,7 +1,7 @@ // #docplaster // #docregion -import {Injectable} from '@angular/core'; +import { Injectable } from '@angular/core'; export class Crisis { constructor(public id: number, public name: string) { } @@ -32,7 +32,7 @@ export class CrisisService { var crises = [ new Crisis(1, 'Dragon Burning Cities'), - new Crisis(2, 'Sky Rains Great White Sharks'), + new Crisis(2, 'Sky Rains Great White Sharks'), new Crisis(3, 'Giant Asteroid Heading For Earth'), new Crisis(4, 'Procrastinators Meeting Delayed Again'), ]; diff --git a/public/docs/_examples/router-deprecated/ts/app/crisis-list.component.ts b/public/docs/_examples/router-deprecated/ts/app/crisis-list.component.ts index 9a22de266a..6caa3653b5 100644 --- a/public/docs/_examples/router-deprecated/ts/app/crisis-list.component.ts +++ b/public/docs/_examples/router-deprecated/ts/app/crisis-list.component.ts @@ -1,6 +1,6 @@ // Initial empty version // #docregion -import {Component} from '@angular/core'; +import { Component } from '@angular/core'; @Component({ template: ` diff --git a/public/docs/_examples/router-deprecated/ts/app/dialog.service.ts b/public/docs/_examples/router-deprecated/ts/app/dialog.service.ts index c795945d2b..5d6160c59f 100644 --- a/public/docs/_examples/router-deprecated/ts/app/dialog.service.ts +++ b/public/docs/_examples/router-deprecated/ts/app/dialog.service.ts @@ -1,5 +1,5 @@ // #docregion -import {Injectable} from '@angular/core'; +import { Injectable } from '@angular/core'; /** * Async modal dialog service * DialogService makes this app easier to test by faking this service. diff --git a/public/docs/_examples/router-deprecated/ts/app/hero-list.component.ts b/public/docs/_examples/router-deprecated/ts/app/hero-list.component.ts index 48c108dde1..5dbbe17d8e 100644 --- a/public/docs/_examples/router-deprecated/ts/app/hero-list.component.ts +++ b/public/docs/_examples/router-deprecated/ts/app/hero-list.component.ts @@ -1,6 +1,6 @@ /// Initial empty version // #docregion -import {Component} from '@angular/core'; +import { Component } from '@angular/core'; @Component({ template: ` diff --git a/public/docs/_examples/router-deprecated/ts/app/heroes/hero-detail.component.1.ts b/public/docs/_examples/router-deprecated/ts/app/heroes/hero-detail.component.1.ts index 7002b9a1dd..bb8509af21 100644 --- a/public/docs/_examples/router-deprecated/ts/app/heroes/hero-detail.component.1.ts +++ b/public/docs/_examples/router-deprecated/ts/app/heroes/hero-detail.component.1.ts @@ -1,7 +1,8 @@ // #docregion -import {Component, OnInit} from '@angular/core'; -import {Hero, HeroService} from './hero.service'; -import {RouteParams, Router} from '@angular/router-deprecated'; +import { Component, OnInit } from '@angular/core'; +import { RouteParams, Router } from '@angular/router-deprecated'; + +import { Hero, HeroService } from './hero.service'; @Component({ template: ` @@ -25,22 +26,22 @@ export class HeroDetailComponent implements OnInit { // #docregion ctor constructor( - private _router:Router, - private _routeParams:RouteParams, - private _service:HeroService){} + private router:Router, + private routeParams:RouteParams, + private service:HeroService){} // #enddocregion ctor // #docregion ngOnInit ngOnInit() { - let id = this._routeParams.get('id'); - this._service.getHero(id).then(hero => this.hero = hero); + let id = this.routeParams.get('id'); + this.service.getHero(id).then(hero => this.hero = hero); } // #enddocregion ngOnInit // #docregion gotoHeroes gotoHeroes() { // Like Heroes - this._router.navigate(['Heroes']); + this.router.navigate(['Heroes']); } // #enddocregion gotoHeroes } diff --git a/public/docs/_examples/router-deprecated/ts/app/heroes/hero-detail.component.ts b/public/docs/_examples/router-deprecated/ts/app/heroes/hero-detail.component.ts index edbf163b37..abf4d4dd3b 100644 --- a/public/docs/_examples/router-deprecated/ts/app/heroes/hero-detail.component.ts +++ b/public/docs/_examples/router-deprecated/ts/app/heroes/hero-detail.component.ts @@ -1,7 +1,8 @@ // #docregion -import {Component, OnInit} from '@angular/core'; -import {Hero, HeroService} from './hero.service'; -import {RouteParams, Router} from '@angular/router-deprecated'; +import { Component, OnInit } from '@angular/core'; +import { RouteParams, Router } from '@angular/router-deprecated'; + +import { Hero, HeroService } from './hero.service'; @Component({ template: ` @@ -25,15 +26,15 @@ export class HeroDetailComponent implements OnInit { // #docregion ctor constructor( - private _router:Router, - private _routeParams:RouteParams, - private _service:HeroService){} + private router:Router, + private routeParams:RouteParams, + private service:HeroService){} // #enddocregion ctor // #docregion ngOnInit ngOnInit() { - let id = this._routeParams.get('id'); - this._service.getHero(id).then(hero => this.hero = hero); + let id = this.routeParams.get('id'); + this.service.getHero(id).then(hero => this.hero = hero); } // #enddocregion ngOnInit @@ -44,7 +45,7 @@ export class HeroDetailComponent implements OnInit { // so that the HeroList component can select that hero. // Add a totally useless `foo` parameter for kicks. // #docregion gotoHeroes-navigate - this._router.navigate(['Heroes', {id: heroId, foo: 'foo'} ]); + this.router.navigate(['Heroes', {id: heroId, foo: 'foo'} ]); // #enddocregion gotoHeroes-navigate } // #enddocregion gotoHeroes diff --git a/public/docs/_examples/router-deprecated/ts/app/heroes/hero-list.component.1.ts b/public/docs/_examples/router-deprecated/ts/app/heroes/hero-list.component.1.ts index 18f6c6e36a..cd11dc8e1a 100644 --- a/public/docs/_examples/router-deprecated/ts/app/heroes/hero-list.component.1.ts +++ b/public/docs/_examples/router-deprecated/ts/app/heroes/hero-list.component.1.ts @@ -2,9 +2,10 @@ // #docregion // TODO SOMEDAY: Feature Componetized like HeroCenter -import {Component, OnInit} from '@angular/core'; -import {Hero, HeroService} from './hero.service'; -import {Router} from '@angular/router-deprecated'; +import { Component, OnInit } from '@angular/core'; +import { Router } from '@angular/router-deprecated'; + +import { Hero, HeroService } from './hero.service'; @Component({ // #docregion template @@ -24,18 +25,18 @@ export class HeroListComponent implements OnInit { // #docregion ctor constructor( - private _router: Router, - private _service: HeroService) { } + private router: Router, + private service: HeroService) { } // #enddocregion ctor ngOnInit() { - this._service.getHeroes().then(heroes => this.heroes = heroes) + this.service.getHeroes().then(heroes => this.heroes = heroes) } // #docregion select onSelect(hero: Hero) { // #docregion nav-to-detail - this._router.navigate( ['HeroDetail', { id: hero.id }] ); + this.router.navigate( ['HeroDetail', { id: hero.id }] ); // #enddocregion nav-to-detail } // #enddocregion select diff --git a/public/docs/_examples/router-deprecated/ts/app/heroes/hero-list.component.ts b/public/docs/_examples/router-deprecated/ts/app/heroes/hero-list.component.ts index 3a5127d11f..0f27e98cd6 100644 --- a/public/docs/_examples/router-deprecated/ts/app/heroes/hero-list.component.ts +++ b/public/docs/_examples/router-deprecated/ts/app/heroes/hero-list.component.ts @@ -2,12 +2,13 @@ // TODO SOMEDAY: Feature Componetized like CrisisCenter // #docregion -import {Component, OnInit} from '@angular/core'; -import {Hero, HeroService} from './hero.service'; +import { Component, OnInit } from '@angular/core'; // #docregion import-route-params -import {Router, RouteParams} from '@angular/router-deprecated'; +import { RouteParams, Router } from '@angular/router-deprecated'; // #enddocregion import-route-params +import { Hero, HeroService } from './hero.service'; + @Component({ // #docregion template template: ` @@ -26,28 +27,30 @@ export class HeroListComponent implements OnInit { heroes: Hero[]; // #docregion ctor - private _selectedId: number; + private selectedId: number; constructor( - private _service: HeroService, - private _router: Router, + private service: HeroService, + private router: Router, routeParams: RouteParams) { - this._selectedId = +routeParams.get('id'); + this.selectedId = +routeParams.get('id'); } // #enddocregion ctor // #docregion isSelected - isSelected(hero: Hero) { return hero.id === this._selectedId; } + isSelected(hero: Hero) { return hero.id === this.selectedId; } // #enddocregion isSelected // #docregion select onSelect(hero: Hero) { - this._router.navigate( ['HeroDetail', { id: hero.id }] ); + this.router.navigate( ['HeroDetail', { id: hero.id }] ); } // #enddocregion select ngOnInit() { - this._service.getHeroes().then(heroes => this.heroes = heroes) + + + this.service.getHeroes().then(heroes => this.heroes = heroes) } } // #enddocregion diff --git a/public/docs/_examples/router-deprecated/ts/app/heroes/hero.service.ts b/public/docs/_examples/router-deprecated/ts/app/heroes/hero.service.ts index 0b6066ee03..a2c4495cb6 100644 --- a/public/docs/_examples/router-deprecated/ts/app/heroes/hero.service.ts +++ b/public/docs/_examples/router-deprecated/ts/app/heroes/hero.service.ts @@ -1,5 +1,5 @@ // #docregion -import {Injectable} from '@angular/core'; +import { Injectable } from '@angular/core'; export class Hero { constructor(public id: number, public name: string) { } diff --git a/public/docs/_examples/router-deprecated/ts/app/main.1.ts b/public/docs/_examples/router-deprecated/ts/app/main.1.ts index d9a288e6c0..8ff3ff84fb 100644 --- a/public/docs/_examples/router-deprecated/ts/app/main.1.ts +++ b/public/docs/_examples/router-deprecated/ts/app/main.1.ts @@ -2,9 +2,10 @@ // #docplaster // #docregion all -import {AppComponent} from './app.component'; -import {bootstrap} from '@angular/platform-browser-dynamic'; -import {ROUTER_PROVIDERS} from '@angular/router-deprecated'; +import { bootstrap } from '@angular/platform-browser-dynamic'; +import { ROUTER_PROVIDERS } from '@angular/router-deprecated'; + +import { AppComponent } from './app.component'; // #enddocregion all @@ -15,9 +16,9 @@ bootstrap(AppComponent, [ */ // Actually use the v.1 component -import {AppComponent as ac} from './app.component.1'; +import { AppComponent as ac} from './app.component.1'; bootstrap(ac, [ // #docregion all ROUTER_PROVIDERS ]); -// #enddocregion all \ No newline at end of file +// #enddocregion all diff --git a/public/docs/_examples/router-deprecated/ts/app/main.2.ts b/public/docs/_examples/router-deprecated/ts/app/main.2.ts index d984713151..9a04fa8109 100644 --- a/public/docs/_examples/router-deprecated/ts/app/main.2.ts +++ b/public/docs/_examples/router-deprecated/ts/app/main.2.ts @@ -4,14 +4,15 @@ // #docplaster // #docregion -import {bootstrap} from '@angular/platform-browser-dynamic'; -import {ROUTER_PROVIDERS} from '@angular/router-deprecated'; -import {AppComponent} from './app.component'; +import { bootstrap } from '@angular/platform-browser-dynamic'; +import { ROUTER_PROVIDERS } from '@angular/router-deprecated'; // Add these symbols to override the `LocationStrategy` -import {provide} from '@angular/core'; -import {LocationStrategy, - HashLocationStrategy} from '@angular/common'; +import { provide } from '@angular/core'; +import { LocationStrategy, + HashLocationStrategy } from '@angular/common'; + +import { AppComponent } from './app.component'; // #enddocregion /* Can't use AppComponent ... but display as if we can // #docregion @@ -21,7 +22,7 @@ bootstrap(AppComponent, [ */ // Actually use the v.2 component -import {AppComponent as ac} from './app.component.2'; +import { AppComponent as ac } from './app.component.2'; bootstrap(ac, [ // #docregion diff --git a/public/docs/_examples/router-deprecated/ts/app/main.3.ts b/public/docs/_examples/router-deprecated/ts/app/main.3.ts index 2c84a01d02..9e9eb04721 100644 --- a/public/docs/_examples/router-deprecated/ts/app/main.3.ts +++ b/public/docs/_examples/router-deprecated/ts/app/main.3.ts @@ -1,7 +1,7 @@ // #docregion -import {bootstrap} from '@angular/platform-browser-dynamic'; -import {ROUTER_PROVIDERS} from '@angular/router-deprecated'; +import { bootstrap } from '@angular/platform-browser-dynamic'; +import { ROUTER_PROVIDERS } from '@angular/router-deprecated'; -import {AppComponent} from './app.component.3'; +import { AppComponent } from './app.component.3'; bootstrap(AppComponent, [ROUTER_PROVIDERS]); diff --git a/public/docs/_examples/router-deprecated/ts/app/main.ts b/public/docs/_examples/router-deprecated/ts/app/main.ts index eb0b424738..08bbbef6e8 100644 --- a/public/docs/_examples/router-deprecated/ts/app/main.ts +++ b/public/docs/_examples/router-deprecated/ts/app/main.ts @@ -1,7 +1,7 @@ // #docregion -import {bootstrap} from '@angular/platform-browser-dynamic'; -import {ROUTER_PROVIDERS} from '@angular/router-deprecated'; +import { bootstrap } from '@angular/platform-browser-dynamic'; +import { ROUTER_PROVIDERS } from '@angular/router-deprecated'; -import {AppComponent} from './app.component'; +import { AppComponent } from './app.component'; bootstrap(AppComponent, [ROUTER_PROVIDERS]); diff --git a/public/docs/_examples/router-deprecated/ts/plnkr.json b/public/docs/_examples/router-deprecated/ts/plnkr.json new file mode 100644 index 0000000000..ad316340f7 --- /dev/null +++ b/public/docs/_examples/router-deprecated/ts/plnkr.json @@ -0,0 +1,12 @@ +{ + "description": "Router deprecated", + "files":[ + "!**/*.d.ts", + "!**/*.js", + "!**/*.[1,2,3].*", + "!app/crisis-list.component.ts", + "!app/hero-list.component.ts", + "!app/crisis-center/add-crisis.component.ts" + ], + "tags": ["router"] +} diff --git a/public/docs/ts/latest/guide/router-deprecated.jade b/public/docs/ts/latest/guide/router-deprecated.jade index c8785640cf..464dc57882 100644 --- a/public/docs/ts/latest/guide/router-deprecated.jade +++ b/public/docs/ts/latest/guide/router-deprecated.jade @@ -10,7 +10,7 @@ include ../_util-fns as users perform application tasks. We cover the router's primary features in this chapter, illustrating them through the evolution - of a small application that we can [run live](/resources/live-examples/router/ts/plnkr.html). + of a small application that we can [run live](/resources/live-examples/router-deprecated/ts/plnkr.html). .l-sub-section img(src='/resources/images/devguide/plunker-separate-window-button.png' alt="pop out the window" align="right" style="margin-right:-20px") :marked @@ -207,7 +207,7 @@ table We discuss code and design decisions pertinent to routing and application design. We gloss over everything in between. - The full source is available in the [live example](/resources/live-examples/router/ts/plnkr.html). + The full source is available in the [live example](/resources/live-examples/router-deprecated/ts/plnkr.html). :marked Our client is the Hero Employment Agency. Heroes need work and The Agency finds Crises for them to solve. @@ -216,7 +216,7 @@ table 1. A *Crisis Center* where we maintain the list of crises for assignment to heroes. 1. A *Heroes* area where we maintain the list of heroes employed by The Agency. - Run the [live example](/resources/live-examples/router/ts/plnkr.html). + Run the [live example](/resources/live-examples/router-deprecated/ts/plnkr.html). It opens in the *Crisis Center*. We'll come back to that. Click the *Heroes* link. We're presented with a list of Heroes. @@ -407,7 +407,7 @@ figure.image-display We're supplying two definitions: +makeExample('router-deprecated/ts/app/app.component.1.ts','route-defs')(format=".") :marked - Each definition translates to a [Route](../api/router/Route-class.html) which has a + Each definition translates to a [Route](../api/router-deprecated/index/Route-class.html) which has a * `path` - the URL path segment for this route * `name` - the name of the route * `component` - the component associated with this route. @@ -459,11 +459,11 @@ figure.image-display :marked Here are the files discussed in this milestone +makeTabs( - `router/ts/app/app.component.1.ts, - router/ts/app/main.1.ts, - router/ts/app/hero-list.component.ts, - router/ts/app/crisis-list.component.ts, - router/ts/index.html`, + `router-deprecated/ts/app/app.component.1.ts, + router-deprecated/ts/app/main.1.ts, + router-deprecated/ts/app/hero-list.component.ts, + router-deprecated/ts/app/crisis-list.component.ts, + router-deprecated/ts/index.html`, ',all,,', `app.component.ts, main.ts, @@ -687,10 +687,10 @@ code-example(format="." language="bash"). ### The Heroes App code Here are the relevant files for this version of the sample application. +makeTabs( - `router/ts/app/app.component.2.ts, - router/ts/app/heroes/hero-list.component.1.ts, - router/ts/app/heroes/hero-detail.component.1.ts, - router/ts/app/heroes/hero.service.ts`, + `router-deprecated/ts/app/app.component.2.ts, + router-deprecated/ts/app/heroes/hero-list.component.1.ts, + router-deprecated/ts/app/heroes/hero-detail.component.1.ts, + router-deprecated/ts/app/heroes/hero.service.ts`, null, `app.component.ts, hero-list.component.ts, @@ -896,8 +896,8 @@ code-example(format=""). interfaces when it creates and destroys components. The router also has hooks for *its* lifecycle such as - [CanActivate](../api/router/CanActivate-decorator.html), [OnActivate](../api/router/OnActivate-interface.html), and - [CanDeactivate](../api/router/CanDeactivate-interface.html). + [CanActivate](../api/router-deprecated/index/CanActivate-decorator.html), [OnActivate](../api/router-deprecated/index/OnActivate-interface.html), and + [CanDeactivate](../api/router-deprecated/index/CanDeactivate-interface.html). These three hooks can change the way the router navigates *to* a component or *away* from a component. The router lifecycle hooks *supplement* the component lifecycle hooks. @@ -999,10 +999,10 @@ code-example(format=""). The relevant *Crisis Center* code for this milestone is +makeTabs( - `router/ts/app/crisis-center/crisis-center.component.ts, - router/ts/app/crisis-center/crisis-list.component.1.ts, - router/ts/app/crisis-center/crisis-detail.component.1.ts, - router/ts/app/crisis-center/crisis.service.ts + `router-deprecated/ts/app/crisis-center/crisis-center.component.ts, + router-deprecated/ts/app/crisis-center/crisis-list.component.1.ts, + router-deprecated/ts/app/crisis-center/crisis-detail.component.1.ts, + router-deprecated/ts/app/crisis-center/crisis.service.ts `, null, `crisis-center.component.ts, @@ -1110,7 +1110,7 @@ code-example(format="." language="bash"). .l-sub-section :marked - The [live example](/resources/live-examples/router/ts/plnkr.html) *does* highlight the selected + The [live example](/resources/live-examples/router-deprecated/ts/plnkr.html) *does* highlight the selected row because it demonstrates the final state of the application which includes the steps we're *about* to cover. At the moment we're describing the state of affairs *prior* to those steps. :marked @@ -1127,7 +1127,7 @@ code-example(format="." language="bash"). First we extend the router import statement to include the `RouteParams` service symbol; +makeExample('router-deprecated/ts/app/heroes/hero-list.component.ts','import-route-params', 'hero-list.component.ts (import)')(format=".") :marked - Then we extend the constructor to inject the `RouteParams` service and extract the `id` parameter as the `_selectedId`: + Then we extend the constructor to inject the `RouteParams` service and extract the `id` parameter as the `selectedId`: +makeExample('router-deprecated/ts/app/heroes/hero-list.component.ts','ctor', 'hero-list.component.ts (constructor)')(format=".") .l-sub-section :marked @@ -1157,10 +1157,10 @@ figure.image-display Confirm the similarities in these *Hero* and *CrisisCenter* components, arranged side-by-side for easy comparison: +makeTabs( - `router/ts/app/heroes/hero-list.component.ts, - router/ts/app/crisis-center/crisis-list.component.ts, - router/ts/app/heroes/hero-detail.component.ts, - router/ts/app/crisis-center/crisis-detail.component.ts + `router-deprecated/ts/app/heroes/hero-list.component.ts, + router-deprecated/ts/app/crisis-center/crisis-list.component.ts, + router-deprecated/ts/app/heroes/hero-detail.component.ts, + router-deprecated/ts/app/crisis-center/crisis-detail.component.ts `, null, `hero-list.component.ts, @@ -1202,7 +1202,7 @@ code-example(format="." language="bash"). As we end our chapter, we take a parting look at the entire application. - We can always try the [live example](/resources/live-examples/router/ts/plnkr.html) and download the source code from there. + We can always try the [live example](/resources/live-examples/router-deprecated/ts/plnkr.html) and download the source code from there. Our final project folder structure looks like this: .filetree @@ -1225,10 +1225,10 @@ code-example(format="." language="bash"). :marked The pertinent top level application files are +makeTabs( - `router/ts/app/app.component.ts, - router/ts/app/main.ts, - router/ts/app/dialog.service.ts, - router/ts/index.html + `router-deprecated/ts/app/app.component.ts, + router-deprecated/ts/app/main.ts, + router-deprecated/ts/app/dialog.service.ts, + router-deprecated/ts/index.html `, null, `app.component.ts, @@ -1251,10 +1251,10 @@ code-example(format="." language="bash"). .file crisis.service.ts :marked +makeTabs( - `router/ts/app/crisis-center/crisis-center.component.ts, - router/ts/app/crisis-center/crisis-list.component.ts, - router/ts/app/crisis-center/crisis-detail.component.ts, - router/ts/app/crisis-center/crisis.service.ts + `router-deprecated/ts/app/crisis-center/crisis-center.component.ts, + router-deprecated/ts/app/crisis-center/crisis-list.component.ts, + router-deprecated/ts/app/crisis-center/crisis-detail.component.ts, + router-deprecated/ts/app/crisis-center/crisis.service.ts `, null, `crisis-center.component.ts, @@ -1275,9 +1275,9 @@ code-example(format="." language="bash"). .file hero.service.ts :marked +makeTabs( - `router/ts/app/heroes/hero-list.component.ts, - router/ts/app/heroes/hero-detail.component.ts, - router/ts/app/heroes/hero.service.ts + `router-deprecated/ts/app/heroes/hero-list.component.ts, + router-deprecated/ts/app/heroes/hero-detail.component.ts, + router-deprecated/ts/app/heroes/hero.service.ts `, null, `hero-list.component.ts,