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

Commit c50d805

Browse files
committed
docs(toh-5/dart): review edits and code cleanup
1 parent 1cc5284 commit c50d805

18 files changed

+512
-490
lines changed

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

+2
Original file line numberDiff line numberDiff line change
@@ -13,6 +13,7 @@ import 'hero_service.dart';
1313

1414
@Component(
1515
selector: 'my-app',
16+
// #docregion template
1617
template: '''
1718
<h1>{{title}}</h1>
1819
<h2>My Heroes</h2>
@@ -25,6 +26,7 @@ import 'hero_service.dart';
2526
</ul>
2627
<my-hero-detail [hero]="selectedHero"></my-hero-detail>
2728
''',
29+
// #enddocregion template
2830
styles: const [
2931
'''
3032
.selected {

public/docs/_examples/toh-5/dart/lib/app_component.css

+1-3
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,4 @@
1-
/* #docplaster */
2-
/* #docregion css */
1+
/* #docregion */
32
h1 {
43
font-size: 1.2em;
54
color: #999;
@@ -28,4 +27,3 @@ nav a:hover {
2827
nav a.router-link-active {
2928
color: #039be5;
3029
}
31-
/* #enddocregion css */

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

+4-5
Original file line numberDiff line numberDiff line change
@@ -27,20 +27,19 @@ import 'package:angular2_tour_of_heroes/hero_detail_component.dart';
2727
directives: const [ROUTER_DIRECTIVES],
2828
providers: const [HeroService, ROUTER_PROVIDERS])
2929
@RouteConfig(const [
30-
// #docregion dashboard-route
30+
// #docregion dashboard-route
3131
const Route(
3232
path: '/dashboard',
3333
name: 'Dashboard',
3434
component: DashboardComponent,
3535
useAsDefault: true),
36-
// #enddocregion dashboard-route
37-
// #docregion hero-detail-route
36+
// #enddocregion dashboard-route
37+
// #docregion hero-detail-route
3838
const Route(
3939
path: '/detail/:id', name: 'HeroDetail', component: HeroDetailComponent),
40-
// #enddocregion hero-detail-route
40+
// #enddocregion hero-detail-route
4141
const Route(path: '/heroes', name: 'Heroes', component: HeroesComponent)
4242
])
4343
class AppComponent {
4444
String title = 'Tour of Heroes';
4545
}
46-
// #enddocregion

public/docs/_examples/toh-5/dart/lib/app_component_1.dart

+2-3
Original file line numberDiff line numberDiff line change
@@ -15,12 +15,11 @@ import 'heroes_component.dart';
1515
<my-heroes></my-heroes>''',
1616
directives: const [HeroesComponent],
1717
providers: const [
18-
// #enddocregion
18+
// #enddocregion
1919
ROUTER_PROVIDERS,
20-
// #docregion
20+
// #docregion
2121
HeroService
2222
])
2323
class AppComponent {
2424
String title = 'Tour of Heroes';
2525
}
26-
// #enddocregion

public/docs/_examples/toh-5/dart/lib/app_component_2.dart

+2-3
Original file line numberDiff line numberDiff line change
@@ -10,12 +10,12 @@ import 'heroes_component.dart';
1010

1111
@Component(
1212
selector: 'my-app',
13-
// #docregion template
13+
// #docregion template
1414
template: '''
1515
<h1>{{title}}</h1>
1616
<a [routerLink]="['Heroes']">Heroes</a>
1717
<router-outlet></router-outlet>''',
18-
// #enddocregion template
18+
// #enddocregion template
1919
// #docregion directives-and-providers
2020
directives: const [ROUTER_DIRECTIVES],
2121
providers: const [ROUTER_PROVIDERS, HeroService]
@@ -29,4 +29,3 @@ import 'heroes_component.dart';
2929
class AppComponent {
3030
String title = 'Tour of Heroes';
3131
}
32-
// #enddocregion

public/docs/_examples/toh-5/dart/lib/dashboard_component.css

-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,3 @@
1-
/* #docplaster */
21
/* #docregion */
32
[class*='col-'] {
43
float: left;
@@ -60,4 +59,3 @@ h4 {
6059
min-width: 60px;
6160
}
6261
}
63-
/* #enddocregion */

public/docs/_examples/toh-5/dart/lib/dashboard_component.dart

+11-7
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
// #docplaster
22
// #docregion
3+
import 'dart:async';
4+
35
import 'package:angular2/core.dart';
46
// #docregion import-router
57
import 'package:angular2/router.dart';
@@ -16,22 +18,25 @@ import 'hero_service.dart';
1618
// #docregion css
1719
styleUrls: const ['dashboard_component.css']
1820
// #enddocregion css
19-
)
21+
)
2022
// #docregion component
2123
class DashboardComponent implements OnInit {
2224
List<Hero> heroes;
23-
// #docregion ctor
25+
26+
// #docregion ctor
2427
final Router _router;
2528
final HeroService _heroService;
2629

2730
DashboardComponent(this._heroService, this._router);
28-
// #enddocregion ctor
2931

30-
ngOnInit() async =>
31-
heroes = (await _heroService.getHeroes()).getRange(1, 5).toList();
32+
// #enddocregion ctor
33+
34+
Future<Null> ngOnInit() async {
35+
heroes = (await _heroService.getHeroes()).getRange(1, 5).toList();
36+
}
3237

3338
// #docregion goto-detail
34-
gotoDetail(Hero hero) {
39+
void gotoDetail(Hero hero) {
3540
var link = [
3641
'HeroDetail',
3742
{'id': hero.id.toString()}
@@ -40,4 +45,3 @@ class DashboardComponent implements OnInit {
4045
}
4146
// #enddocregion goto-detail
4247
}
43-
// #enddocregion

public/docs/_examples/toh-5/dart/lib/dashboard_component.html

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<!-- #docregion -->
22
<h3>Top Heroes</h3>
33
<div class="grid grid-pad">
4-
<!-- #docregion click -->
4+
<!-- #docregion click -->
55
<div *ngFor="let hero of heroes" (click)="gotoDetail(hero)" class="col-1-4" >
6-
<!-- #enddocregion click -->
6+
<!-- #enddocregion click -->
77
<div class="module hero">
88
<h4>{{hero.name}}</h4>
99
</div>

public/docs/_examples/toh-5/dart/lib/dashboard_component_2.dart

+7-6
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
// #docplaster
22
// #docregion imports
3+
import 'dart:async';
4+
35
import 'package:angular2/core.dart';
46

57
import 'hero.dart';
@@ -9,17 +11,16 @@ import 'hero_service.dart';
911
// #docregion component
1012
@Component(
1113
selector: 'my-dashboard',
12-
templateUrl: 'dashboard_component.html'
13-
)
14+
templateUrl: 'dashboard_component.html')
1415
class DashboardComponent implements OnInit {
1516
List<Hero> heroes;
1617
final HeroService _heroService;
1718

1819
DashboardComponent(this._heroService);
1920

20-
ngOnInit() async =>
21-
heroes = (await _heroService.getHeroes()).getRange(1, 5).toList();
21+
Future<Null> ngOnInit() async {
22+
heroes = (await _heroService.getHeroes()).getRange(1, 5).toList();
23+
}
2224

23-
gotoDetail(){ /* not implemented yet */}
25+
gotoDetail() {/* not implemented yet */}
2426
}
25-
// #enddocregion component
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
// #docplaster
22
// #docregion
33
// #docregion v2
4+
import 'dart:async';
45
import 'dart:html';
56

67
// #docregion import-oninit
@@ -20,37 +21,35 @@ import 'hero_service.dart';
2021
selector: 'my-hero-detail',
2122
// #docregion template-url
2223
templateUrl: 'hero_detail_component.html',
23-
// #enddocregion template-url
24-
// #enddocregion v2
24+
// #enddocregion template-url, v2
2525
styleUrls: const ['hero_detail_component.css']
26-
// #docregion v2
27-
)
26+
// #docregion v2
27+
)
2828
// #enddocregion extract-template
2929
// #docregion implement
3030
class HeroDetailComponent implements OnInit {
31-
// #enddocregion implement
31+
// #enddocregion implement
3232
Hero hero;
33-
// #docregion ctor
33+
// #docregion ctor
3434
final HeroService _heroService;
3535
final RouteParams _routeParams;
3636

3737
HeroDetailComponent(this._heroService, this._routeParams);
38-
// #enddocregion ctor
38+
// #enddocregion ctor
3939

40-
// #docregion ng-oninit
41-
ngOnInit() async {
40+
// #docregion ng-oninit
41+
Future<Null> ngOnInit() async {
4242
// #docregion get-id
43-
var id = int.parse(_routeParams.get('id'));
43+
var idString = _routeParams.get('id');
44+
var id = int.parse(idString, onError: (_) => null);
4445
// #enddocregion get-id
45-
hero = await (_heroService.getHero(id));
46+
if (id != null) hero = await (_heroService.getHero(id));
4647
}
47-
// #enddocregion ng-oninit
48+
// #enddocregion ng-oninit
4849

49-
// #docregion go-back
50-
goBack() {
50+
// #docregion go-back
51+
void goBack() {
5152
window.history.back();
5253
}
53-
// #enddocregion go-back
54+
// #enddocregion go-back
5455
}
55-
// #enddocregion v2
56-
// #enddocregion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,3 @@
1-
// #docplaster
2-
31
// #docregion
42
import 'dart:async';
53

@@ -10,18 +8,16 @@ import 'mock_heroes.dart';
108

119
@Injectable()
1210
class HeroService {
13-
Future<List<Hero>> getHeroes() async => HEROES;
11+
Future<List<Hero>> getHeroes() async => mockHeroes;
1412

1513
// See the "Take it slow" appendix
1614
Future<List<Hero>> getHeroesSlowly() {
1715
return new Future<List<Hero>>.delayed(
18-
const Duration(seconds: 2), () => HEROES // 2 seconds
19-
);
16+
const Duration(seconds: 2), () => mockHeroes);
2017
}
2118

22-
//#docregion get-hero
19+
// #docregion get-hero
2320
Future<Hero> getHero(int id) async =>
24-
HEROES.where((hero) => hero.id == id).first;
25-
//#enddocregion get-hero
21+
(await getHeroes()).firstWhere((hero) => hero.id == id);
22+
// #enddocregion get-hero
2623
}
27-
// #enddocregion

public/docs/_examples/toh-5/dart/lib/heroes_component.dart

+9-15
Original file line numberDiff line numberDiff line change
@@ -9,30 +9,27 @@ import 'hero.dart';
99
import 'hero_detail_component.dart';
1010
import 'hero_service.dart';
1111

12-
// #docregion metadata
13-
// #docregion heroes-component-renaming
12+
// #docregion metadata, heroes-component-renaming
1413
@Component(
1514
selector: 'my-heroes',
16-
// #enddocregion heroes-component-renaming
15+
// #enddocregion heroes-component-renaming
1716
templateUrl: 'heroes_component.html',
1817
styleUrls: const ['heroes_component.css'],
1918
directives: const [HeroDetailComponent]
20-
// #docregion heroes-component-renaming
19+
// #docregion heroes-component-renaming
2120
)
22-
// #enddocregion heroes-component-renaming
23-
// #enddocregion metadata
24-
// #docregion class
25-
// #docregion heroes-component-renaming
21+
// #enddocregion heroes-component-renaming, metadata
22+
// #docregion class, heroes-component-renaming
2623
class HeroesComponent implements OnInit {
27-
// #enddocregion heroes-component-renaming
24+
// #enddocregion heroes-component-renaming
2825
final Router _router;
2926
final HeroService _heroService;
3027
List<Hero> heroes;
3128
Hero selectedHero;
3229

3330
HeroesComponent(this._heroService, this._router);
3431

35-
Future getHeroes() async {
32+
Future<Null> getHeroes() async {
3633
heroes = await _heroService.getHeroes();
3734
}
3835

@@ -42,10 +39,7 @@ class HeroesComponent implements OnInit {
4239

4340
void onSelect(Hero hero) { selectedHero = hero; }
4441

45-
Future gotoDetail() =>
42+
Future<Null> gotoDetail() =>
4643
_router.navigate(['HeroDetail', {'id': selectedHero.id.toString()}]);
47-
// #docregion heroes-component-renaming
44+
// #docregion heroes-component-renaming
4845
}
49-
// #enddocregion heroes-component-renaming
50-
// #enddocregion class
51-
// #enddocregion

public/docs/_examples/toh-5/dart/lib/heroes_component.html

-2
Original file line numberDiff line numberDiff line change
@@ -17,5 +17,3 @@ <h2>
1717
</h2>
1818
<button (click)="gotoDetail()">View Details</button>
1919
</div>
20-
<!-- #enddocregion mini-detail -->
21-
<!-- #enddocregion -->

public/docs/_examples/toh-5/dart/lib/mock_heroes.dart

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import 'hero.dart';
22

3-
final List<Hero> HEROES = [
3+
final List<Hero> mockHeroes = [
44
new Hero(11, 'Mr. Nice'),
55
new Hero(12, 'Narco'),
66
new Hero(13, 'Bombasto'),

public/docs/_examples/toh-5/dart/web/index.html

+5-4
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,11 @@
11
<!DOCTYPE html>
22
<html>
3-
<!-- #docregion head -->
4-
<!-- #docregion base-href -->
3+
<!-- #docregion head, base-href -->
54
<head>
6-
<base href="/"> <!-- For testing using pub serve directly -->
7-
<!-- base href="/dart/web/" --> <!-- For testing in WebStorm -->
5+
<!-- For testing using pub serve directly use: -->
6+
<base href="/">
7+
<!-- For testing in WebStorm use: -->
8+
<!-- base href="/dart/web/" -->
89
<!-- #enddocregion base-href -->
910
<title>Angular 2 Tour of Heroes</title>
1011
<meta name="viewport" content="width=device-width, initial-scale=1">

public/docs/_examples/toh-5/dart/web/main.dart

+1-1
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,6 @@ import 'package:angular2/platform/browser.dart';
22

33
import 'package:angular2_tour_of_heroes/app_component.dart';
44

5-
main() {
5+
void main() {
66
bootstrap(AppComponent);
77
}
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,24 @@
1+
/* #docregion toh-excerpt */
2+
/* Master Styles */
3+
h1 {
4+
color: #369;
5+
font-family: Arial, Helvetica, sans-serif;
6+
font-size: 250%;
7+
}
8+
h2, h3 {
9+
color: #444;
10+
font-family: Arial, Helvetica, sans-serif;
11+
font-weight: lighter;
12+
}
13+
body {
14+
margin: 2em;
15+
}
16+
body, input[text], button {
17+
color: #888;
18+
font-family: Cambria, Georgia;
19+
}
20+
/* . . . */
21+
/* everywhere else */
22+
* {
23+
font-family: Arial, Helvetica, sans-serif;
24+
}

0 commit comments

Comments
 (0)