0

I use this code to display amount and currency:

 <td>{{transaction.amount | currency: transaction.currency :'code'}}</td>

This is the visual result:

USD10,080.00

Is there a way to get this result: 10,080.00 USD

Peter Penzov
  • 1,126
  • 134
  • 430
  • 808

1 Answers1

1

If you are formatting the number and appending the ISO4217 currency code, then no need to output the symbol and code with the CurrencyPipe doc. Only use the pipe to format the number, and then append the currency code after the pipe output:

 <td>{{ transaction.amount | currency:transaction.currency:'' }} {{ transaction.currency }}</td>

The second argument to the pipe removes the currency and symbol from the output. However, the number will still be formatted according to the currency.

jo_va
  • 13,504
  • 3
  • 23
  • 47
  • I get Error: InvalidPipeArgument: 'Missing locale data for the locale "fr".' for pipe 'CurrencyPipe' – Peter Penzov Apr 23 '19 at 21:54
  • @Peter Penzov, you will have to import the data for the locale, I updated the answer. – jo_va Apr 23 '19 at 21:58
  • @jo_va are you sure? 'fr' is not mandatory. I have `transaction.amount` and `transaction.currency` I need to get the locale from them. – Peter Penzov Apr 23 '19 at 22:00
  • @Peter Penzov, I thought using 'fr' would switch the currency symbol to the right, but it will actually also format the numbers... – jo_va Apr 23 '19 at 22:02
  • Any idea what will be the solution? – Peter Penzov Apr 23 '19 at 22:03
  • I'm not an angular developer, so I could be wrong, but since you're trying to ignore the locale format anyway, couldn't you just call [`getCurrencySymbol`](https://angular.io/api/common/getCurrencySymbol) by itself? e.g. `{{txn.amount | currency:txn.currency:''}} {{getCurrencySymbol(txn.currency)}}`? – p.s.w.g Apr 23 '19 at 22:08
  • @p.s.w.g I get TypeError: _co.getCurrencySymbol is not a function – Peter Penzov Apr 23 '19 at 22:09
  • @p.s.w.g, I think that would be the solution, I was looking for a way to extract the currency, getCurrencySymbol seems to do just that. And the empty string given as second argument to the pipe will suppress the symbol from the output. – jo_va Apr 23 '19 at 22:10
  • @Peter Penzov, actually, since you are output the code of the currency, why not output it directly ? – jo_va Apr 23 '19 at 22:15
  • can you give some example please? – Peter Penzov Apr 23 '19 at 22:16
  • @PeterPenzov This question also seems relevant: [Get currency symbol angular 2](https://stackoverflow.com/q/46077521/1715579) – p.s.w.g Apr 23 '19 at 22:16
  • @PeterPenzov, do you want to only output the currency code ? such as USD, EUR, CAD ? if so, simply print the ISO4217 currency code you give as an argument to the pipe – jo_va Apr 23 '19 at 22:18
  • @jo_va yes: 10,080.00 USD – Peter Penzov Apr 23 '19 at 22:19
  • @Peter Penzov, to me that looks like the raw currency code you are passing to the pipe, so if that holds for the other currencies as well, simply append that, as shown in the answer. No need to fetch the symbol for the currency – jo_va Apr 23 '19 at 22:20
  • By the way is there more elegant way? Looks like dirty solution to me? – Peter Penzov Apr 23 '19 at 22:24
  • @Peter Penzov, I think this would be the easiest solution – jo_va Apr 23 '19 at 22:26
  • @jo_va Any alternatives? – Peter Penzov Apr 23 '19 at 22:27
  • @Peter Penzov, if your formatting is fixed, ie, does not change according to the currency, then you could use the DecimalPipe to format the number and then append the currency code. – jo_va Apr 23 '19 at 22:28
  • It's changed according to the currency. – Peter Penzov Apr 23 '19 at 22:29
  • @Peter Penzov, since your formatting changes according to the currency, using the number pipe would be irrelevant, so I think this answer is the easiest way to go. If you want to know more about the DecimalPipe, you can check [this link](https://angular.io/api/common/DecimalPipe) – jo_va Apr 23 '19 at 22:31