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

Commit ec392ab

Browse files
andresaraujokwalrath
andresaraujo
authored and
kwalrath
committed
docs(guide): add dart version of hierarchical dependency injection
closes #683
1 parent 8501cbc commit ec392ab

File tree

10 files changed

+237
-0
lines changed

10 files changed

+237
-0
lines changed

‎public/docs/_examples/hierarchical-dependency-injection/dart/lib/edit_item.dart

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
// #docregion
2+
class EditItem<T> {
3+
bool editing = false;
4+
T item;
5+
EditItem(this.item);
6+
}
7+
// #enddocregion

‎public/docs/_examples/hierarchical-dependency-injection/dart/lib/hero.dart

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
// #docregion
2+
import 'package:angular2/angular2.dart';
3+
4+
class Hero {
5+
String name;
6+
String power;
7+
8+
Hero clone() {
9+
return new Hero()
10+
..name = name
11+
..power = power;
12+
}
13+
}
14+
// #enddocregion

‎public/docs/_examples/hierarchical-dependency-injection/dart/lib/hero_card_component.dart

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
// #docregion
2+
import 'package:angular2/angular2.dart';
3+
import 'package:hierarchical_di/hero.dart';
4+
5+
@Component(
6+
selector: 'hero-card',
7+
template: '''
8+
<div>
9+
<span>Name:</span>
10+
<span>{{hero.name}}</span>
11+
</div>
12+
''')
13+
class HeroCardComponent {
14+
@Input() Hero hero;
15+
}
16+
// #docregion

‎public/docs/_examples/hierarchical-dependency-injection/dart/lib/hero_editor_component.dart

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
// #docregion
2+
import 'package:angular2/angular2.dart';
3+
import 'package:hierarchical_di/restore_service.dart';
4+
import 'package:hierarchical_di/hero.dart';
5+
6+
@Component(
7+
selector: 'hero-editor',
8+
// #docregion providers
9+
providers: const [RestoreService],
10+
// #enddocregion providers
11+
template: '''
12+
<div>
13+
<span>Name:</span>
14+
<input [(ngModel)]="hero.name"/>
15+
<div>
16+
<button (click)="onSaved()">save</button>
17+
<button (click)="onCanceled()">cancel</button>
18+
</div>
19+
</div>
20+
''')
21+
class HeroEditorComponent {
22+
@Output() final EventEmitter canceled = new EventEmitter();
23+
@Output() final EventEmitter saved = new EventEmitter();
24+
25+
RestoreService<Hero> _restoreService;
26+
27+
HeroEditorComponent(this._restoreService);
28+
29+
@Input()
30+
set hero(Hero hero) {
31+
_restoreService.setItem(hero);
32+
}
33+
34+
Hero get hero {
35+
return _restoreService.getItem();
36+
}
37+
38+
onSaved() {
39+
saved.add(_restoreService.getItem());
40+
}
41+
42+
onCanceled() {
43+
hero = _restoreService.restoreItem();
44+
canceled.add(hero);
45+
}
46+
}
47+
// #enddocregion

‎public/docs/_examples/hierarchical-dependency-injection/dart/lib/heroes_list_component.dart

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,53 @@
1+
// #docregion
2+
import 'package:angular2/angular2.dart';
3+
import 'package:hierarchical_di/hero.dart';
4+
import 'package:hierarchical_di/heroes_service.dart';
5+
import 'package:hierarchical_di/hero_editor_component.dart';
6+
import 'package:hierarchical_di/hero_card_component.dart';
7+
import 'package:hierarchical_di/edit_item.dart';
8+
9+
@Component(
10+
selector: 'heroes-list',
11+
template: '''
12+
<div>
13+
<ul>
14+
<li *ngFor="#editItem of heroes">
15+
<hero-card
16+
[hidden]="editItem.editing"
17+
[hero]="editItem.item">
18+
</hero-card>
19+
<button
20+
[hidden]="editItem.editing"
21+
(click)="editItem.editing = true">
22+
edit
23+
</button>
24+
<hero-editor
25+
(saved)="onSaved(editItem, \$event)"
26+
(canceled)="onCanceled(editItem)"
27+
[hidden]="!editItem.editing"
28+
[hero]="editItem.item">
29+
</hero-editor>
30+
</li>
31+
</ul>
32+
</div>
33+
''',
34+
directives: const [HeroCardComponent, HeroEditorComponent])
35+
class HeroesListComponent {
36+
List<EditItem<Hero>> heroes;
37+
HeroesListComponent(HeroesService heroesService) {
38+
heroes = heroesService
39+
.getHeroes()
40+
.map((Hero item) => new EditItem(item))
41+
.toList();
42+
}
43+
44+
onSaved(EditItem<Hero> editItem, Hero updatedHero) {
45+
editItem.item = updatedHero;
46+
editItem.editing = false;
47+
}
48+
49+
onCanceled(EditItem<Hero> editItem) {
50+
editItem.editing = false;
51+
}
52+
}
53+
// #enddocregion

‎public/docs/_examples/hierarchical-dependency-injection/dart/lib/heroes_service.dart

Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
import 'package:angular2/angular2.dart';
2+
import 'package:hierarchical_di/hero.dart';
3+
4+
@Injectable()
5+
class HeroesService {
6+
List<Hero> _heroes = [
7+
new Hero()
8+
..name = "RubberMan"
9+
..power = 'Flexibility',
10+
new Hero()
11+
..name = "Tornado"
12+
..power = 'Weather changer'
13+
];
14+
15+
List<Hero> getHeroes() {
16+
return _heroes;
17+
}
18+
}

‎public/docs/_examples/hierarchical-dependency-injection/dart/lib/restore_service.dart

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
// #docregion
2+
import 'package:angular2/angular2.dart';
3+
4+
@Injectable()
5+
class RestoreService<T> {
6+
T _originalItem;
7+
T _currentItem;
8+
9+
setItem(T item) {
10+
print(item.runtimeType);
11+
_originalItem = item;
12+
_currentItem = clone(item);
13+
}
14+
15+
T getItem() {
16+
return _currentItem;
17+
}
18+
19+
T restoreItem() {
20+
_currentItem = _originalItem;
21+
return getItem();
22+
}
23+
24+
T clone(T item) {
25+
// super poor clone implementation
26+
return item.clone();
27+
}
28+
}
29+
// #enddocregion

‎public/docs/_examples/hierarchical-dependency-injection/dart/pubspec.yaml

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
# #docregion
2+
name: 'hierarchical_di'
3+
version: 0.0.1
4+
description: hierarchical dependency injection example
5+
6+
environment:
7+
sdk: '>=1.0.0 <2.0.0'
8+
9+
dependencies:
10+
angular2: '2.0.0-beta.1'
11+
browser: ^0.10.0
12+
dart_to_js_script_rewriter: '^0.1.0'
13+
14+
transformers:
15+
- angular2:
16+
platform_directives:
17+
- 'package:angular2/common.dart#COMMON_DIRECTIVES'
18+
entry_points: web/main.dart
19+
- dart_to_js_script_rewriter

‎public/docs/_examples/hierarchical-dependency-injection/dart/web/index.html

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
<!DOCTYPE html>
2+
3+
<html>
4+
<head>
5+
<meta charset="utf-8">
6+
<meta http-equiv="X-UA-Compatible" content="IE=edge">
7+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
8+
<title>Hierarchical Injector</title>
9+
<script defer src="main.dart" type="application/dart"></script>
10+
<script defer src="packages/browser/dart.js"></script>
11+
</head>
12+
13+
<body>
14+
<!-- #docregion heroes-list -->
15+
<heroes-list>loading...</heroes-list>
16+
<!-- #enddocregion heroes-list -->
17+
18+
</body>
19+
</html>

‎public/docs/_examples/hierarchical-dependency-injection/dart/web/main.dart

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
// #docregion
2+
import 'package:angular2/bootstrap.dart';
3+
import 'package:hierarchical_di/heroes_service.dart';
4+
import 'package:hierarchical_di/heroes_list_component.dart';
5+
6+
void main() {
7+
bootstrap(HeroesListComponent, [HeroesService]);
8+
}
9+
10+
/* Documentation artifact below
11+
// #docregion bad-alternative
12+
// Don't do this!
13+
bootstrap(HeroesListComponent, [HeroesService, RestoreService])
14+
// #enddocregion bad-alternative
15+
*/

0 commit comments

Comments
 (0)