X-Git-Url: http://juplo.de/gitweb/?a=blobdiff_plain;f=src%2Fapp%2Fhero-detail%2Fhero-detail.component.ts;h=76e7912fc40ec748fc5aa29a3a36701166d288a5;hb=fd92a662c471619278e561f25a4beb7ef78d0690;hp=c252bcffe4905eb339cd4ecbd01d71c7690a29f6;hpb=f18faff7c576b595dd8765f36805aa8176122db7;p=examples%2Fangular-tour-of-heroes diff --git a/src/app/hero-detail/hero-detail.component.ts b/src/app/hero-detail/hero-detail.component.ts index c252bcf..76e7912 100644 --- a/src/app/hero-detail/hero-detail.component.ts +++ b/src/app/hero-detail/hero-detail.component.ts @@ -1,9 +1,10 @@ -import { Component, OnInit, Input } from '@angular/core'; +import { Component, OnInit } from '@angular/core'; import { ActivatedRoute } from '@angular/router'; import { Location } from '@angular/common'; import { HeroService } from '../hero.service'; import { Hero } from '../hero'; +import { MessageService } from '../message.service'; @Component({ selector: 'app-hero-detail', @@ -12,11 +13,12 @@ import { Hero } from '../hero'; }) export class HeroDetailComponent implements OnInit { - @Input() hero : Hero; + hero: Hero | undefined; constructor( private route: ActivatedRoute, private heroService: HeroService, + private messageService: MessageService, private location: Location ) { } @@ -25,8 +27,14 @@ export class HeroDetailComponent implements OnInit { } getHero(): void { - const id = +this.route.snapshot.paramMap.get('id'); - this.heroService.getHero(id).subscribe(hero => this.hero = hero); + this.route.params.subscribe(params => { + const id: number = +params.id; + this.hero = undefined; + this.heroService.getHero(id).subscribe(hero => { + this.messageService.add('HeroDetailComponent: retrived hero ' + JSON.stringify(hero)); + this.hero = hero; + }); + }); } goBack(): void {