How to correctly call an asynchronous method with a parameter from html markup in angular?

Question

Angular

Angular project, there is an asynchronous method that makes a request for data by parameter

async getAddressByCode(addressCode: string) {
  const address = await this.resourceService.getAddressByCode(addressCode).toPromise();
  return address;
}

How to correctly call this method from html markup?
Tried like this
<span>{{getAddressByCode(addressCode)}}</span>
as a result on the page
[object Promise]
Tried like this

<span>{{async getAddressByCode(addressCode)}}</span>

This causes a parsing error Parser Error: Unexpected token 'getAdressByCode'
In general, is it possible in angular to call normal async methods, and not just RxJs?

Answer 1

<span>{{ getAddressByCode(addressCode) | async }}</span>

AsyncPipe can open promises.
Of course, the method will be called each time the changes are checked.
is it possible in angular to call normal async methods, not just RxJs?
Angular is still js and you can work with asyncs in it. But as a rule, it is not necessary because completely unnecessary wrappers are created, rx is simply more convenient.
For requests, xhr is used, and its event-based nature is easily converted to an rx stream.