What I would do is add an avatar property to each Person, and populate it as rarely as you can (probably only once). Then you just can say <img [src]="aPerson.avatar">.
Persons refers to data returned from a get request to a wordpress site for “persons”. This return data does not have a link to the avatar. Instead it has a “featured_media” id with which I must make a separate api call for the media return data. From there I use the source_url property to get the avatar link.
Binding to the getAvatar method was my attempt to plug *nFor data to get a media link for each iteration from a different api call.
I get that, but you want to be doing that on your schedule, and presumably you can fire off each one of those requests for each person once the list of people comes back, and simply assign the result to an “avatar” property that you add locally.
It’s a bad idea, because as you noticed, Angular’s change detection calls any functions in template expressions a lot.