import { Component , EventEmitter , Input , Output , ChangeDetectionStrategy , } from '@angular/core' ; import { Hero } from '../../core' ; @ Component ( { selector : 'app-hero-list' , templateUrl : './hero-list.component.html' , styleUrls : [ './hero-list.component.scss' ] , changeDetection : ChangeDetectionStrategy . OnPush , } ) export class HeroListComponent { @ Input ( ) errorMessage = undefined ; @ Input ( ) heroes : Hero [ ] ; @ Output ( ) deleted = new EventEmitter < Hero > ( ) ; @ Output ( ) selected = new EventEmitter < Hero > ( ) ; trackByHero ( index , hero ) { return hero . id ; } selectHero ( hero ) { this . selected . emit ( hero ) ; } deleteHero ( hero ) { this . deleted . emit ( hero ) ; } }