发表新帖
发表新帖

INR currency format

前端 未结
关注
19 1703
栀梦
栀梦 2020-12-09 17:31

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

₹1
₹10
₹100
₹1,000
₹10,000
₹1,00,000
......
相关标签:
19条回答
  • 刺人心
    2020-12-09 18:04

    If any one looking same in angular 2 then here is solution , 1.Create custom pipe 2.Use in your html pipe code

    1.Create custom pipe .

    Create file indianCurrency.pipe.ts

    import { Pipe, PipeTransform } from '@angular/core';

@Pipe({name: 'indianCurrency'})
export class IndianCurrency implements PipeTransform {
  transform(value: number, args: string[]): any {

        if (! isNaN(value)) {
            var currencySymbol = '₹';
            //var output = Number(input).toLocaleString('en-IN');   <-- This method is not working fine in all browsers!           
            var result = value.toString().split('.');

            var lastThree = result[0].substring(result[0].length - 3);
            var otherNumbers = result[0].substring(0, result[0].length - 3);
            if (otherNumbers != '')
                lastThree = ',' + lastThree;
            var output = otherNumbers.replace(/\B(?=(\d{2})+(?!\d))/g, ",") + lastThree;

            if (result.length > 1) {
                output += "." + result[1];
            }            

            return currencySymbol + output;
        }

  }
}

    Declare in app.module.ts 

     declarations: [
  .....,
    IndianCurrency
  ],

    2.Use in your html 

    {{amount | indianCurrency}}
    0 讨论(0)
  • 北海茫月
    2020-12-09 18:06

    Indian rupee follows different format compare to US currency; So, don't use default angular currency filter to format Indian Rupees

    Custom INR Currency Filter

    var app = angular.module('app', []);

app.controller('indexCtrl', function ($scope) {
    $scope.amount = 10000000.33;
});

app.filter('INR', function () {        
    return function (input) {
        if (! isNaN(input)) {
            var currencySymbol = '₹';
            //var output = Number(input).toLocaleString('en-IN');   <-- This method is not working fine in all browsers!           
            var result = input.toString().split('.');

            var lastThree = result[0].substring(result[0].length - 3);
            var otherNumbers = result[0].substring(0, result[0].length - 3);
            if (otherNumbers != '')
                lastThree = ',' + lastThree;
            var output = otherNumbers.replace(/\B(?=(\d{2})+(?!\d))/g, ",") + lastThree;
            
            if (result.length > 1) {
                output += "." + result[1];
            }            

            return currencySymbol + output;
        }
    }
});
    <!DOCTYPE html>
<html ng-app="app">
<head>    
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
</head>
<body ng-controller="indexCtrl">
    Input: <input type="text" ng-model="amount">
    <h3>{{amount | INR}}</h3>
</body>
</html>

    0 讨论(0)
  • 走了就别回头了
    2020-12-09 18:06

    In angular, Create a custom filter like this

    myApp.filter('ic', function()
{
   return function(value)
   {
       return '₹ ' + value;
   }
});

    And then you can {{data|number|ic}}

    0 讨论(0)
  • 傲寒
    2020-12-09 18:08

    You can make a filter using toLocaleString like :

    Number(data).toLocaleString('en-IN', { style: 'currency', currency: 'INR', maximumFractionDigits: 0})

    Filter example :

    .filter('IndianCurrency', function() {
    return function(data) {
        if (null != data) {
            return Number(data).toLocaleString('en-IN', { style: 'currency', currency: 'INR', maximumFractionDigits: 0});
        } else {
            return Number(0).toLocaleString('en-IN', { style: 'currency',currency: 'INR', maximumFractionDigits: 0});
        }
    };
});

    Usage :

    {{ rent | IndianCurrency }}
    0 讨论(0)
  • 不思量自难忘°
    2020-12-09 18:11

    You can use this : {{amount:| currency:"₹"}} or you can use hex code for "₹"

    Input: {{3*100000000 | currency:"₹"}}

    Output: ₹300,000,000.00

    0 讨论(0)
  • 不思量自难忘°
    2020-12-09 18:12

    AngularJS

    In HTML

    {{ currency_expression | currency : symbol : fractionSize}}

    for example

    {{amount | currency:"₹":0}}

    AngularJS docs Currency Pipe

    Angular 2+

    {{amount | currency:'INR':'symbol-narrow':'4.2-2'}}

    you can also refer Currency Pipe

    0 讨论(0)
 看不清?
提交回复
热议问题