docs(toh): update HTTP chapter with style guide conventions
closes #1477
This commit is contained in:
parent
6475b5efab
commit
129b34c77e
|
@ -16,17 +16,17 @@ export class DashboardComponent implements OnInit {
|
||||||
heroes: Hero[] = [];
|
heroes: Hero[] = [];
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private _router: Router,
|
private router: Router,
|
||||||
private _heroService: HeroService) {
|
private heroService: HeroService) {
|
||||||
}
|
}
|
||||||
|
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
this._heroService.getHeroes()
|
this.heroService.getHeroes()
|
||||||
.then(heroes => this.heroes = heroes.slice(1,5));
|
.then(heroes => this.heroes = heroes.slice(1,5));
|
||||||
}
|
}
|
||||||
|
|
||||||
gotoDetail(hero: Hero) {
|
gotoDetail(hero: Hero) {
|
||||||
let link = ['HeroDetail', { id: hero.id }];
|
let link = ['HeroDetail', { id: hero.id }];
|
||||||
this._router.navigate(link);
|
this.router.navigate(link);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -1,10 +1,11 @@
|
||||||
// #docplaster
|
// #docplaster
|
||||||
// #docregion
|
// #docregion
|
||||||
import { Component, Input, Output, OnInit, EventEmitter } from '@angular/core';
|
import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
|
||||||
import { RouteParams } from '@angular/router-deprecated';
|
import { RouteParams } from '@angular/router-deprecated';
|
||||||
|
|
||||||
import { Hero } from './hero';
|
import { Hero } from './hero';
|
||||||
import { HeroService } from './hero.service';
|
import { HeroService } from './hero.service';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'my-hero-detail',
|
selector: 'my-hero-detail',
|
||||||
templateUrl: 'app/hero-detail.component.html',
|
templateUrl: 'app/hero-detail.component.html',
|
||||||
|
@ -17,16 +18,16 @@ export class HeroDetailComponent implements OnInit {
|
||||||
navigated = false; // true if navigated here
|
navigated = false; // true if navigated here
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private _heroService: HeroService,
|
private heroService: HeroService,
|
||||||
private _routeParams: RouteParams) {
|
private routeParams: RouteParams) {
|
||||||
}
|
}
|
||||||
|
|
||||||
// #docregion ngOnInit
|
// #docregion ngOnInit
|
||||||
ngOnInit() {
|
ngOnInit() {
|
||||||
if (this._routeParams.get('id') !== null) {
|
if (this.routeParams.get('id') !== null) {
|
||||||
let id = +this._routeParams.get('id');
|
let id = +this.routeParams.get('id');
|
||||||
this.navigated = true;
|
this.navigated = true;
|
||||||
this._heroService.getHero(id)
|
this.heroService.getHero(id)
|
||||||
.then(hero => this.hero = hero);
|
.then(hero => this.hero = hero);
|
||||||
} else {
|
} else {
|
||||||
this.navigated = false;
|
this.navigated = false;
|
||||||
|
@ -36,7 +37,7 @@ export class HeroDetailComponent implements OnInit {
|
||||||
// #enddocregion ngOnInit
|
// #enddocregion ngOnInit
|
||||||
// #docregion save
|
// #docregion save
|
||||||
save() {
|
save() {
|
||||||
this._heroService
|
this.heroService
|
||||||
.save(this.hero)
|
.save(this.hero)
|
||||||
.then(hero => {
|
.then(hero => {
|
||||||
this.hero = hero; // saved hero, w/ id if new
|
this.hero = hero; // saved hero, w/ id if new
|
||||||
|
|
|
@ -1,7 +1,7 @@
|
||||||
// #docplaster
|
// #docplaster
|
||||||
// #docregion
|
// #docregion
|
||||||
import { Injectable } from '@angular/core';
|
import { Injectable } from '@angular/core';
|
||||||
import { Http, Headers } from '@angular/http';
|
import { Headers, Http } from '@angular/http';
|
||||||
|
|
||||||
// #docregion rxjs
|
// #docregion rxjs
|
||||||
import 'rxjs/add/operator/toPromise';
|
import 'rxjs/add/operator/toPromise';
|
||||||
|
|
|
@ -21,11 +21,11 @@ export class HeroesComponent implements OnInit {
|
||||||
error: any;
|
error: any;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
private _router: Router,
|
private router: Router,
|
||||||
private _heroService: HeroService) { }
|
private heroService: HeroService) { }
|
||||||
|
|
||||||
getHeroes() {
|
getHeroes() {
|
||||||
this._heroService
|
this.heroService
|
||||||
.getHeroes()
|
.getHeroes()
|
||||||
.then(heroes => this.heroes = heroes)
|
.then(heroes => this.heroes = heroes)
|
||||||
.catch(error => this.error = error); // TODO: Display error message
|
.catch(error => this.error = error); // TODO: Display error message
|
||||||
|
@ -46,7 +46,7 @@ export class HeroesComponent implements OnInit {
|
||||||
// #docregion delete
|
// #docregion delete
|
||||||
delete(hero: Hero, event: any) {
|
delete(hero: Hero, event: any) {
|
||||||
event.stopPropagation();
|
event.stopPropagation();
|
||||||
this._heroService
|
this.heroService
|
||||||
.delete(hero)
|
.delete(hero)
|
||||||
.then(res => {
|
.then(res => {
|
||||||
this.heroes = this.heroes.filter(h => h !== hero);
|
this.heroes = this.heroes.filter(h => h !== hero);
|
||||||
|
@ -66,6 +66,6 @@ export class HeroesComponent implements OnInit {
|
||||||
}
|
}
|
||||||
|
|
||||||
gotoDetail() {
|
gotoDetail() {
|
||||||
this._router.navigate(['HeroDetail', { id: this.selectedHero.id }]);
|
this.router.navigate(['HeroDetail', { id: this.selectedHero.id }]);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -201,7 +201,7 @@ code-example(format="." language="bash").
|
||||||
:marked
|
:marked
|
||||||
### Save
|
### Save
|
||||||
|
|
||||||
We combine the call to the private `_post` and `_put` methods in a single `save` method. This simplifies the public api and makes the integration with `HeroDetailComponent` easier. `HeroService` determines which method to call based on the state of the `hero` object. If the hero already has an id we know it's an edit. Otherwise we know it's an add.
|
We combine the call to the private `post` and `put` methods in a single `save` method. This simplifies the public api and makes the integration with `HeroDetailComponent` easier. `HeroService` determines which method to call based on the state of the `hero` object. If the hero already has an id we know it's an edit. Otherwise we know it's an add.
|
||||||
|
|
||||||
+makeExample('toh-6/ts/app/hero.service.ts', 'save', 'app/hero.service.ts (save hero)')(format=".")
|
+makeExample('toh-6/ts/app/hero.service.ts', 'save', 'app/hero.service.ts (save hero)')(format=".")
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue