html - Angular 4 anropa en funktion inom en <td>

Jag har den här biten av kod:

personListComponent.html

<tr *ngFor="let person of personService.getPersons()">
      <td (onShow)="getCountry(person)">{{person.name}}</td>
      <td>{{country}}
</tr

personListaKomponent.ts

country : string = '';

getCountry(person : Person){
  this.country = this.countryservice.getCountry(person.countryid);
}

Jag vill hämta landet från personen och visa det i tabellen, men (onShow) anropar aldrig getCountry()-funktionen. Finns det ett sätt att anropa denna funktion från inom <td>-elementet? Eller något sätt att visa landet?

Svar #1

Utan att använda ngShow kan du direkt utvärdera en funktion inne i td som följer,

<tr *ngFor="let person of personService.getPersons()">
      <td>{{person.name}}</td>
      <td>{{getCountry(person) | async}}
</tr>

och funktionen som

getCountry(person : Person){
  return  this.countryservice.getCountry(person.countryid);
}