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

Commit 683e761

Browse files
committed
docs(toh-3/dart): copyedits and new snake_case glossary entry
Copyedits made to glossary as well. Note that "Scoped Package" has been removed from the Dart glossary.
1 parent 1cc5284 commit 683e761

File tree

6 files changed

+59
-47
lines changed

6 files changed

+59
-47
lines changed

public/docs/_examples/toh-3/dart/lib/app_component.dart

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ import 'hero_detail_component.dart';
1010

1111
@Component(
1212
selector: 'my-app',
13-
// #docregion hero-detail-template
13+
// #docregion hero-detail-template
1414
template: '''
1515
<h1>{{title}}</h1>
1616
<h2>My Heroes</h2>
@@ -23,8 +23,9 @@ import 'hero_detail_component.dart';
2323
</ul>
2424
<my-hero-detail [hero]="selectedHero"></my-hero-detail>
2525
''',
26-
// #enddocregion hero-detail-template
27-
styles: const ['''
26+
// #enddocregion hero-detail-template
27+
styles: const [
28+
'''
2829
.selected {
2930
background-color: #CFD8DC !important;
3031
color: white;
@@ -73,17 +74,16 @@ import 'hero_detail_component.dart';
7374
}
7475
'''
7576
],
76-
// #docregion directives
77-
directives: const [
78-
HeroDetailComponent
79-
])
80-
// #enddocregion directives
77+
// #docregion directives
78+
directives: const [HeroDetailComponent]
79+
// #enddocregion directives
80+
)
8181
class AppComponent {
8282
final String title = 'Tour of Heroes';
8383
final List<Hero> heroes = mockHeroes;
8484
Hero selectedHero;
8585

86-
onSelect(Hero hero) {
86+
void onSelect(Hero hero) {
8787
selectedHero = hero;
8888
}
8989
}

public/docs/_examples/toh-3/dart/lib/hero.dart

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,4 +5,3 @@ class Hero {
55

66
Hero(this.id, this.name);
77
}
8-
// #enddocregion

public/docs/_examples/toh-3/dart/lib/hero_detail_component.dart

Lines changed: 15 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -11,29 +11,26 @@ import 'hero.dart';
1111
// #docregion v1
1212
@Component(
1313
selector: 'my-hero-detail',
14-
// #enddocregion v1
14+
// #enddocregion v1
1515
// #docregion template
1616
template: '''
17-
<div *ngIf="hero != null">
18-
<h2>{{hero.name}} details!</h2>
19-
<div><label>id: </label>{{hero.id}}</div>
20-
<div>
21-
<label>name: </label>
22-
<input [(ngModel)]="hero.name" placeholder="name">
23-
</div>
24-
</div>
25-
'''
17+
<div *ngIf="hero != null">
18+
<h2>{{hero.name}} details!</h2>
19+
<div><label>id: </label>{{hero.id}}</div>
20+
<div>
21+
<label>name: </label>
22+
<input [(ngModel)]="hero.name" placeholder="name">
23+
</div>
24+
</div>'''
2625
// #enddocregion template
27-
// #docregion v1
26+
// #docregion v1
2827
)
2928
class HeroDetailComponent {
30-
// #enddocregion v1
31-
// #docregion inputs
29+
// #enddocregion v1
30+
// #docregion inputs
3231
@Input()
33-
// #docregion hero
32+
// #docregion hero
3433
Hero hero;
35-
// #enddocregion hero
36-
// #enddocregion inputs
37-
// #docregion v1
34+
// #enddocregion hero, inputs
35+
// #docregion v1
3836
}
39-
// #enddocregion v1

public/docs/dart/latest/glossary.jade

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,7 +12,19 @@ include _util-fns
1212
!=partial('../../ts/latest/_fragments/glossary-f-l')
1313
!=partial('../../ts/latest/_fragments/glossary-m1')
1414
//!=partial('../../ts/latest/_fragments/glossary-m2') not needed in dart
15-
!=partial('../../ts/latest/_fragments/glossary-n-s')
15+
!=partial('../../ts/latest/_fragments/glossary-n-s-1')
16+
17+
:marked
18+
## snake_case
19+
.l-sub-section
20+
:marked
21+
The practice of writing compound words or phrases such that each word is separated by an underscore (`_`).
22+
23+
Library and file names are often spelled in snake_case. Examples include: `angular2_tour_of_heroes` and `app_component.dart`.
24+
25+
This form is also known as **underscore case**.
26+
27+
!=partial('../../ts/latest/_fragments/glossary-n-s-2')
1628
!=partial('../../ts/latest/_fragments/glossary-t1')
1729
//!=partial('../../ts/latest/_fragments/glossary-t2') notneeded in dart
1830
!=partial('../../ts/latest/_fragments/glossary-u-z')

public/docs/dart/latest/tutorial/toh-pt3.jade

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ p Run the #[+liveExampleLink2('', 'toh-3')] for this part.
2626
### Keep the app compiling and running
2727
We want to start the Dart compiler, have it watch for changes, and start our server. We'll do this by typing
2828

29-
code-example(format="." language="bash").
29+
code-example(language="bash").
3030
pub serve
3131

3232
:marked
@@ -50,7 +50,7 @@ code-example(format="." language="bash").
5050
### Separating the Hero Detail Component
5151
Add a new file named `hero_detail_component.dart` to the `lib` folder and create `HeroDetailComponent` as follows.
5252

53-
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'v1', 'hero_detail_component.dart (initial version)')(format=".")
53+
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'v1', 'lib/hero_detail_component.dart (initial version)')(format=".")
5454
.l-sub-section
5555
:marked
5656
### Naming conventions
@@ -61,7 +61,8 @@ code-example(format="." language="bash").
6161

6262
All of our component names end in "Component". All of our component file names end in "_component".
6363

64-
We spell our filenames in lower underscore case (AKA "snake_case") so we don't worry about
64+
We spell our filenames in lower **underscore case**
65+
(AKA **[snake_case](../guide/glossary.html#!#snake_case)**) so we don't worry about
6566
case sensitivity on the server or in source control.
6667

6768
<!-- TODO
@@ -89,26 +90,26 @@ code-example(format="." language="bash").
8990
So we replace `selectedHero` with `hero` everywhere in our new template. That's our only change.
9091
The result looks like this:
9192

92-
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'template', 'hero_detail_component.dart (template)')(format=".")
93+
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'template', 'lib/hero_detail_component.dart (template)')(format=".")
9394

9495
:marked
9596
Now our hero detail layout exists only in the `HeroDetailComponent`.
9697

9798
#### Add the *hero* property
9899
Let’s add that `hero` property we were talking about to the component class.
99-
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'hero')(format=".")
100+
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'hero')
100101
:marked
101102
Uh oh. We declared the `hero` property as type `Hero` but our `Hero` class is over in the `app_component.dart` file.
102103
We have two components, each in their own file, that need to reference the `Hero` class.
103104

104105
We solve the problem by relocating the `Hero` class from `app_component.dart` to its own `hero.dart` file.
105106

106-
+makeExample('toh-3/dart/lib/hero.dart', null, 'hero.dart (Exported Hero class)')(format=".")
107+
+makeExample('toh-3/dart/lib/hero.dart', '', 'lib/hero.dart')(format=".")
107108

108109
:marked
109-
Add the following import statement near the top of both `app_component.dart` and `hero_detail_component.dart`.
110+
Add the following import statement near the top of **both `app_component.dart` and `hero_detail_component.dart`**.
110111

111-
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'hero-import', 'hero_detail_component.dart and app_component.dart (Import the Hero class)')(format=".")
112+
+makeExample('toh-3/dart/lib/hero_detail_component.dart', 'hero-import')
112113

113114
:marked
114115
#### The *hero* property is an ***input***
@@ -167,7 +168,7 @@ code-example(format=".")
167168
:marked
168169
The `AppComponent`’s template should now look like this
169170

170-
+makeExample('toh-3/dart/lib/app_component.dart', 'hero-detail-template', 'app_component.dart (Template)')(format=".")
171+
+makeExample('toh-3/dart/lib/app_component.dart', 'hero-detail-template', 'app_component.dart (template)')(format=".")
171172
:marked
172173
Thanks to the binding, the `HeroDetailComponent` should receive the hero from the `AppComponent` and display that hero's detail beneath the list.
173174
The detail should update every time the user picks a new hero.
@@ -237,6 +238,8 @@ code-example(format=".")
237238
* We learned to bind a parent component to a child component.
238239
* We learned to declare the application directives we need in a `directives` list.
239240

241+
p Run the #[+liveExampleLink2('', 'toh-3')] for this part.
242+
240243
.l-main-section
241244
:marked
242245
## The Road Ahead

public/docs/ts/latest/glossary.jade

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -150,9 +150,9 @@ include _util-fns
150150
## dash-case
151151
.l-sub-section
152152
:marked
153-
The practice of writing compound words or phrases such that each word is separated by a dash or hyphen (-).
153+
The practice of writing compound words or phrases such that each word is separated by a dash or hyphen (`-`).
154154

155-
Directive selectors and the root of filenames are often spelled in dash-case. Examples include: `my-app` and the `hero-list.component.ts`.
155+
Directive selectors and the root of filenames are often spelled in dash-case. Examples include: `my-app` and `hero-list.component.ts`.
156156

157157
This form is also known as [kebab-case](#kebab-case).
158158

@@ -408,9 +408,9 @@ include _util-fns
408408
## kebab-case
409409
.l-sub-section
410410
:marked
411-
The practice of writing compound words or phrases such that each word is separated by a dash or hyphen (-).
411+
The practice of writing compound words or phrases such that each word is separated by a dash or hyphen (`-`).
412412

413-
Directive selectors and the root of filenames are often spelled in kebab-case. Examples include: `my-app` and the `hero-list.component.ts`.
413+
Directive selectors and the root of filenames are often spelled in kebab-case. Examples include: `my-app` and `hero-list.component.ts`.
414414

415415
This form is also known as [dash-case](#dash-case).
416416

@@ -480,7 +480,7 @@ include _util-fns
480480

481481
// #enddocregion m2
482482
483-
// #docregion n-s
483+
// #docregion n-s-1
484484
- var lang = current.path[1]
485485
- var decorator = lang === 'dart' ? 'annotation' : '<a href="#decorator">decorator</a>'
486486
- var atSym = lang === 'js' ? '' : '@'
@@ -570,6 +570,7 @@ include _util-fns
570570

571571
<a id="S"></a>
572572
.l-main-section
573+
// #enddocregion n-s-1
573574
:marked
574575
## Scoped Package
575576
.l-sub-section
@@ -582,9 +583,9 @@ include _util-fns
582583
We import a scoped package the same way we'd import a *normal* package.
583584
The only difference, from a consumer perspective,
584585
is that the package name begins with the Angular *scope name*, `@angular`.
585-
// #enddocregion n-s
586-
+makeExample('../docs/_fragments/architecture/ts/app/app.component.ts', 'import')(format=".")
587-
// #docregion n-s
586+
587+
+makeExample('../docs/_fragments/architecture/ts/app/app.component.ts', 'import')(format=".")
588+
// #docregion n-s-2
588589
589590
:marked
590591
## Structural Directive
@@ -596,7 +597,7 @@ include _util-fns
596597

597598
The `ngIf` "conditional element" directive and the `ngFor` "repeater" directive are
598599
good examples in this category.
599-
// #enddocregion n-s
600+
// #enddocregion n-s-2
600601
601602
// #docregion t1
602603
<a id="T"></a>

0 commit comments

Comments
 (0)