I had a bug where my application needed currency conversion data to change the currencies via angular PIPES. Pipes has advantages of changing the currencies at front end while disadvantage of Independency from basic component rendering.

My component renders so quickly.

My pipes needed currency conversion data from a service. So it was showing blank for the first time if he don’t get the currency data at the very beginning.

Put the below code in app.component.ts

 

 

My translate service has

for getting currency data.

currencyRates will be which my pipe needed to convert into other.

Refer https://currencylayer.com/ for daily free currency conversion apis upto 250 req. Store it into your own database and it can be used for a day long. You might need to convert it into EURUSD as it provides USDEUR i also coded this for the same to convertion

This will give you below output rates from EUR to other.