Handle undefined selectedHero

faulhaberben · Jun 19, 2023 · 2c3bb15 · 2c3bb15
1 parent ac13b65
commit 2c3bb15
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 2 deletions.
diff --git a/aio/content/examples/toh-pt3/src/app/heroes/heroes.component.html b/aio/content/examples/toh-pt3/src/app/heroes/heroes.component.html
@@ -10,5 +10,7 @@ <h2>My Heroes</h2>
 </ul>
 
 <!-- #docregion hero-detail-binding -->
-<app-hero-detail [hero]="selectedHero"></app-hero-detail>
+<ng-container *ngIf="selectedHero">
+  <app-hero-detail [hero]="selectedHero"></app-hero-detail>
+<ng-container>
 <!-- #enddocregion hero-detail-binding -->
diff --git a/aio/content/examples/toh-pt3/src/app/heroes/heroes.component.ts b/aio/content/examples/toh-pt3/src/app/heroes/heroes.component.ts
@@ -11,7 +11,7 @@ export class HeroesComponent {
 
   heroes = HEROES;
 
-  selectedHero!: Hero;
+  selectedHero?: Hero;
 
   onSelect(hero: Hero): void {
     this.selectedHero = hero;