INR currency format

Question

I need to show currency format like these, how can we show.

₹1
₹10
₹100
₹1,000
₹10,000
₹1,00,000
......

Answer 1

@Pipe({
  name: 'customCurrency'
})
export class CustomCurrencyPipe implements PipeTransform {

  transform(value: number, isSymbol: string, decPointer: string, isPrefix: boolean): string {

    if (!isNaN(value)) {
       var formatted_value;
      var currencyText = isSymbol;
      if (currencyText == '₹') {
        // for Indian number system
        formatted_value = new Intl.NumberFormat('en-IN').format(value)
      }
      else {
        formatted_value = new Intl.NumberFormat().format(value)
      }
      return currencyText + ' ' + formatted_value;
    }
  }

}

HTML

<div>{{ 10000000 | customCurrency:'₹':'1.0':false}}</div>

Answer 2

Use combination of comma separator pipe and Custom INR Currency PIPE

In HTML

1.first use comma separator pipe .

2.After that use custom pipe INRpipe

{{ currency_expression | number: ' ' : 'en-IN' | INRpipe }}

Pipe.ts

transform(value: string): string {

if (!value) {
  return null;
}

return `₹${value}`; // this line will only solve your problem

Below is optional

/ if you want to add two decimal point in currency /

then follow this way.

if (value.includes('.')) {

  return `₹${value}`;

}

return ₹${value}.00;

}

Answer 3

I know it's a bit late, but you can just use https://osrec.github.io/currencyFormatter.js/ which handles

Then all you need is:

// Outputs ₹ 25,34,234.00
OSREC.CurrencyFormatter.format(2534234, { currency: 'INR' }); 

Answer 4

I believe the currency pipe will solve this problem

Note: Syntax for digit param in the symbol is -> "numberOfInteger:minimumFractions-maxFractions"

Input: {{1499 | currency:'INR':'symbol':'1.0'}}

Output: ₹1,499

Explanation -> '1.0' means currency pipe will display at least 1 digits and no decimal.

Let me provide you with another example:

Input: {{99 | currency:'INR':'symbol':'3.2-2'}}

Output: ₹099.00

Explanation -> '3.2-2' means currency pipe will display at least 3 digits and the decimal point minimum 2 fractions & maximum 2 fractions are displayed.

Answer 5

1. Get the digits before last three.
2. Replace the rest of the digits with prefix.replace(/\B(?=(?:\d{2})+(?!\d))/g, ",")
3. Combine the above section with this modified prefix

Complete explanation on why this regex places commas at the right place is is mentioned here.

Answer 6

{{myobject.price | currency:'INR'}}

If you don't need last decimal value then you can use number pipe with

₹{{myobject.price | number}}

If you don't need last decimal value but you want to use the inbuilt currency pipe functionality, then you can create a custom pipe for currency or you can create a split pipe and use with currency

Ex: {{myobject.price  | currency:'INR' | custSplit:".":"0"}}

Note: custSplit- It is a custom pipe it split the string what ever we pass (here- ".") and take the index what we need(Here- "0"Index).

For more on pipe, read angular 2+ doc