Skip to content
This repository was archived by the owner on Dec 4, 2017. It is now read-only.

Commit 7784faa

Browse files
chalinwardbell
authored andcommitted
docs(toh-2): copyedits (#3504)
1 parent 71c862d commit 7784faa

File tree

1 file changed

+8
-7
lines changed

1 file changed

+8
-7
lines changed

public/docs/ts/latest/tutorial/toh-pt2.jade

Lines changed: 8 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -84,7 +84,7 @@ code-example(language="sh" class="code-shell").
8484

8585
### List heroes with ngFor
8686

87-
The goal is to bind the array of `heroes` in the component to the template, iterate over them,
87+
The goal is to bind the array of heroes in the component to the template, iterate over them,
8888
and display them individually.
8989

9090
Modify the `<li>` tag by adding the built-in directive `*ngFor`.
@@ -154,7 +154,7 @@ code-example(language="sh" class="code-shell").
154154
Next you'll connect the master to the detail through a `selectedHero` component property,
155155
which is bound to a click event.
156156

157-
### Add a click event
157+
### Handle click events
158158
Add a click event binding to the `<li>` like this:
159159

160160

@@ -188,15 +188,16 @@ code-example(language="sh" class="code-shell").
188188

189189
:marked
190190
The template still refers to the old `hero` property.
191-
Bind to the new selectedHero property instead as follows:
191+
Bind to the new `selectedHero` property instead as follows:
192192

193193

194194
+makeExample('toh-2/ts/src/app/app.component.1.html', 'selectedHero-details', 'app.component.ts (template excerpt)')(format='.')
195195

196196
:marked
197197
### Hide the empty detail with ngIf
198198

199-
When the app loads, the `selectedHero` is undefined and won't be defined until you click a hero's name.
199+
When the app loads, `selectedHero` is undefined.
200+
The selected hero is initialized when the user clicks a hero's name.
200201
Angular can't display properties of the undefined `selectedHero` and throws the following error,
201202
visible in the browser's console:
202203

@@ -220,7 +221,7 @@ code-example(language="sh" class="code-shell").
220221
The app no longer fails and the list of names displays again in the browser.
221222

222223
:marked
223-
When there is no `selectedHero`, the `ngIf` directive removes the hero detail HTML from the DOM.
224+
When there is no selected hero, the `ngIf` directive removes the hero detail HTML from the DOM.
224225
There are no hero detail elements or bindings to worry about.
225226

226227
When the user picks a hero, `selectedHero` becomes defined and
@@ -287,5 +288,5 @@ code-example(language="sh" class="code-shell").
287288

288289
## The road ahead
289290
You've expanded the Tour of Heroes app, but it's far from complete.
290-
You can't put the entire app into a single component.
291-
In the [next page](toh-pt3.html), you'll split the app into sub-components and make them work together.
291+
An app shouldn't be one monolithic component.
292+
In the [next page](toh-pt3.html), you'll split the app into subcomponents and make them work together.

0 commit comments

Comments
 (0)