From 217ae1628938da1776f6a17f47b5387f42984835 Mon Sep 17 00:00:00 2001
From: Jeff Auriemma <jdauriemma@gmail.com>
Date: Fri, 2 Sep 2016 17:39:44 -0400
Subject: [PATCH 1/2] Update HeroService#create documentation #2231

- add short blurb explaining HeroService#create
- include HeroService#create snippet
---
 public/docs/ts/latest/tutorial/toh-pt6.jade | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/public/docs/ts/latest/tutorial/toh-pt6.jade b/public/docs/ts/latest/tutorial/toh-pt6.jade
index 8f17d79380..3b01802b02 100644
--- a/public/docs/ts/latest/tutorial/toh-pt6.jade
+++ b/public/docs/ts/latest/tutorial/toh-pt6.jade
@@ -294,6 +294,10 @@ block get-heroes-details
   When the given name is non-blank, the handler delegates creation of the
   named hero to the hero service, and then adds the new hero to our !{_array}.
 
+  Finally, we implement the create method in the HeroService class.
+
++makeExcerpt('app/hero.service.ts', 'create')
+
   Go ahead, refresh the browser and create some new heroes!
 
 .l-main-section

From c69e81c7c589bd1edea52ef7c3bd0acd0b4dc621 Mon Sep 17 00:00:00 2001
From: Jeff Auriemma <jdauriemma@gmail.com>
Date: Fri, 2 Sep 2016 18:01:31 -0400
Subject: [PATCH 2/2] Replace erroneous template string

- earlier in tutorial we moved the h1 tag out of heroes.component.ts
- create new example
- update example reference in jade template
---
 .../toh-5/ts/app/heroes.component.1.ts        | 96 +++++++++++++++++++
 public/docs/ts/latest/tutorial/toh-pt5.jade   |  2 +-
 2 files changed, 97 insertions(+), 1 deletion(-)
 create mode 100644 public/docs/_examples/toh-5/ts/app/heroes.component.1.ts

diff --git a/public/docs/_examples/toh-5/ts/app/heroes.component.1.ts b/public/docs/_examples/toh-5/ts/app/heroes.component.1.ts
new file mode 100644
index 0000000000..333cb7f2e3
--- /dev/null
+++ b/public/docs/_examples/toh-5/ts/app/heroes.component.1.ts
@@ -0,0 +1,96 @@
+// #docplaster
+// #docregion
+import { Component, OnInit } from '@angular/core';
+
+import { Hero } from './hero';
+// #docregion hero-service-import
+import { HeroService } from './hero.service';
+// #enddocregion hero-service-import
+
+@Component({
+  selector: 'my-app',
+  // #docregion template
+  template: `
+    <h2>My Heroes</h2>
+    <ul class="heroes">
+      <li *ngFor="let hero of heroes"
+        [class.selected]="hero === selectedHero"
+        (click)="onSelect(hero)">
+        <span class="badge">{{hero.id}}</span> {{hero.name}}
+      </li>
+    </ul>
+    <my-hero-detail [hero]="selectedHero"></my-hero-detail>
+  `,
+  // #enddocregion template
+  styles: [`
+    .selected {
+      background-color: #CFD8DC !important;
+      color: white;
+    }
+    .heroes {
+      margin: 0 0 2em 0;
+      list-style-type: none;
+      padding: 0;
+      width: 15em;
+    }
+    .heroes li {
+      cursor: pointer;
+      position: relative;
+      left: 0;
+      background-color: #EEE;
+      margin: .5em;
+      padding: .3em 0;
+      height: 1.6em;
+      border-radius: 4px;
+    }
+    .heroes li.selected:hover {
+      background-color: #BBD8DC !important;
+      color: white;
+    }
+    .heroes li:hover {
+      color: #607D8B;
+      background-color: #DDD;
+      left: .1em;
+    }
+    .heroes .text {
+      position: relative;
+      top: -3px;
+    }
+    .heroes .badge {
+      display: inline-block;
+      font-size: small;
+      color: white;
+      padding: 0.8em 0.7em 0 0.7em;
+      background-color: #607D8B;
+      line-height: 1em;
+      position: relative;
+      left: -1px;
+      top: -4px;
+      height: 1.8em;
+      margin-right: .8em;
+      border-radius: 4px 0 0 4px;
+    }
+  `],
+  providers: [HeroService]
+})
+export class AppComponent implements OnInit {
+  title = 'Tour of Heroes';
+  heroes: Hero[];
+  selectedHero: Hero;
+
+  constructor(private heroService: HeroService) { }
+
+// #docregion get-heroes
+  getHeroes(): void {
+    this.heroService.getHeroes().then(heroes => this.heroes = heroes);
+  }
+// #enddocregion get-heroes
+
+  ngOnInit(): void {
+    this.getHeroes();
+  }
+
+  onSelect(hero: Hero): void {
+    this.selectedHero = hero;
+  }
+}
diff --git a/public/docs/ts/latest/tutorial/toh-pt5.jade b/public/docs/ts/latest/tutorial/toh-pt5.jade
index c845938fff..5e9b955f9d 100644
--- a/public/docs/ts/latest/tutorial/toh-pt5.jade
+++ b/public/docs/ts/latest/tutorial/toh-pt5.jade
@@ -662,7 +662,7 @@ block extract-id
   That component's current template exhibits a "master/detail" style with the list of heroes
   at the top and details of the selected hero below.
 
-+makeExample('toh-4/ts/app/app.component.ts','template', 'app/heroes.component.ts (current template)')(format=".")
++makeExample('toh-5/ts/app/heroes.component.1.ts','template', 'app/heroes.component.ts (current template)')(format=".")
 
 :marked
   Delete the last line of the template with the `<my-hero-detail>` tags.