907f848c95
* docs(toh-6/dart): refactoring of 'add, edit, delete heroes' Refactoring of "add, edit, delete heroes" section of toh-6 from one big bottom-up step into small independent feature slices, where the user achieves a "milesone" (i.e., can run the full app) after each feature section. The section rewrite is shorter and offers a better UX. Other simplifications: - Error handling is consistent: in the hero service we log to the console, everwhere else we just let errors bubble up. - Hero service methods renamed based on function (create, update) rather then lower-level implementation (post, put). - @Output properties have been eliminated (since they weren't explained). E2E tests now pass on both the TS and Dart sides. * docs(toh-6/ts): refactoring of 'add, edit, delete heroes' Refactoring of "add, edit, delete heroes" section of toh-6 from one big bottom-up step into small independent feature slices, where the user achieves a "milesone" (i.e., can run the full app) after each feature section. The section rewrite is shorter and offers a better UX. Other simplifications: - Error handling is consistent: in the hero service we log to the console, everwhere else we just let errors bubble up. - Hero service methods renamed based on function (create, update) rather then lower-level implementation (post, put). - @Output properties have been eliminated (since they weren't explained). E2E tests now pass on both the TS and Dart sides. Post-Dart-review updates included. * docs(toh-6): ward tweaks
59 lines
1.3 KiB
Dart
59 lines
1.3 KiB
Dart
// #docregion
|
|
import 'dart:async';
|
|
|
|
import 'package:angular2/core.dart';
|
|
import 'package:angular2/router.dart';
|
|
|
|
import 'hero.dart';
|
|
import 'hero_detail_component.dart';
|
|
import 'hero_service.dart';
|
|
|
|
@Component(
|
|
selector: 'my-heroes',
|
|
templateUrl: 'heroes_component.html',
|
|
styleUrls: const ['heroes_component.css'],
|
|
directives: const [HeroDetailComponent])
|
|
class HeroesComponent implements OnInit {
|
|
List<Hero> heroes;
|
|
Hero selectedHero;
|
|
|
|
final HeroService _heroService;
|
|
final Router _router;
|
|
|
|
HeroesComponent(this._heroService, this._router);
|
|
|
|
Future<Null> getHeroes() async {
|
|
heroes = await _heroService.getHeroes();
|
|
}
|
|
|
|
// #docregion add
|
|
Future<Null> add(String name) async {
|
|
name = name.trim();
|
|
if (name.isEmpty) return;
|
|
heroes.add(await _heroService.create(name));
|
|
selectedHero = null;
|
|
}
|
|
// #enddocregion add
|
|
|
|
// #docregion delete
|
|
Future<Null> delete(Hero hero) async {
|
|
await _heroService.delete(hero.id);
|
|
heroes.remove(hero);
|
|
if (selectedHero == hero) selectedHero = null;
|
|
}
|
|
// #enddocregion delete
|
|
|
|
void ngOnInit() {
|
|
getHeroes();
|
|
}
|
|
|
|
void onSelect(Hero hero) {
|
|
selectedHero = hero;
|
|
}
|
|
|
|
Future<Null> gotoDetail() => _router.navigate([
|
|
'HeroDetail',
|
|
{'id': selectedHero.id.toString()}
|
|
]);
|
|
}
|