javascript - Format number to money format in angular

I want to convert a number to number format.

I've tried this so far:

function formatMoney(credits) {

    console.log(credits+'credits');
    var lastThree = credits.substring(credits.length-3);
    // var lastThree = credits.slice(-2);
    var otherNumbers = credits.substring(0,credits.length-3);
    console.log(otherNumbers+'otherNumbers');
    if(otherNumbers !== '')
        lastThree = ',' + lastThree;
    var res = otherNumbers.replace(/\B(?=(\d{2})+(?!\d))/g, ",") + lastThree;
    return res;
  }

function formatNumber(num) {
    var n1, n2;
    num = (Math.round(num * 100) / 100) + '' || '';
    n1 = num.split('.');
    n2 = n1[1] || null;
    n1 = n1[0].replace(/(\d)(?=(\d\d)+\d$)/g, ",");
    num = n2 ? n1 + '.' + n2 : n1;
    return num;
  }

I want to convert the number to Indian currency.

Example:

The output that I am getting with function formatMoney(): 1,0,0,000

The output that I am getting with function formatNumber(): 1,000 and after pressing 0, it changes to NaN0

What am I doing wrong here?

I want to convert a number to number format.

I've tried this so far: http://plnkr.co/edit/lVJGXyuX0BMvB9QUL5zS?p=preview

function formatMoney(credits) {

    console.log(credits+'credits');
    var lastThree = credits.substring(credits.length-3);
    // var lastThree = credits.slice(-2);
    var otherNumbers = credits.substring(0,credits.length-3);
    console.log(otherNumbers+'otherNumbers');
    if(otherNumbers !== '')
        lastThree = ',' + lastThree;
    var res = otherNumbers.replace(/\B(?=(\d{2})+(?!\d))/g, ",") + lastThree;
    return res;
  }

function formatNumber(num) {
    var n1, n2;
    num = (Math.round(num * 100) / 100) + '' || '';
    n1 = num.split('.');
    n2 = n1[1] || null;
    n1 = n1[0].replace(/(\d)(?=(\d\d)+\d$)/g, ",");
    num = n2 ? n1 + '.' + n2 : n1;
    return num;
  }

I want to convert the number to Indian currency.

Example:

The output that I am getting with function formatMoney(): 1,0,0,000

The output that I am getting with function formatNumber(): 1,000 and after pressing 0, it changes to NaN0

What am I doing wrong here?

Share Improve this question asked Dec 26, 2015 at 14:49 nirvair 4,19013 gold badges59 silver badges96 bronze badges

this has an answer already. stackoverflow./questions/16037165/… if this doesn't work, ill be happy to give it a go. – JoeCrash Commented Dec 26, 2015 at 14:54
@Conceptz I might be wrong, being quite new here, but I think this question warrants a different, angularJS based answer given how it is tagged – Emile Paffard-Wray Commented Dec 26, 2015 at 15:04
@Conceptz: I tried the same code, doesn't work for me. What am I doing wrong here? – nirvair Commented Dec 26, 2015 at 15:05
Emile Paffard-Wray wrote a good answer, see my ment for the adjustment you need, and upvote his answer if it works. – JoeCrash Commented Dec 26, 2015 at 15:08

Add a ment |

3 Answers 3

Sorted by: Reset to default 4

AngularJS providers filters for doing these kinds of things, there is a currency filter available:

I have rewritten your code with the formatting functions removed and replaced with the currency filter plus the Rupee symbol for Indian currency, hope this solves your problem.

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

app.controller('MainCtrl', function($scope) {
  
  $scope.change=function($event, money){
      $scope.money = qwerty;
    };
});

<script src="https://ajax.googleapis./ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link rel="stylesheet" href="style.css" />
    <script data-require="[email protected]" src="https://code.angularjs/1.2.20/angular.js" data-semver="1.2.20"></script>
    <script src="app.js"></script>
  </head>

  <body ng-controller="MainCtrl">
    <input  ng-keypress="change($event, money)" type="text" ng-model='money' >
    <pre>{{money | currency : "&#8377;" }}</pre>
  </body>

</html>

U dont need angular to do this as there is an api in core Javascript Intl.

var number = 2453413.70;

console.log(new Intl.NumberFormat('en-IN', { style: "currency", currency: "INR" }).format(number));

if you dont want currency symbol, use it like this

console.log(new Intl.NumberFormat('en-IN').format(number));

You may inject and use the $filter service directly into your controller or even your view

var myApp = angular.module('myApp', []);
myApp.controller('CalcCtrl', function ($scope, $filter) {
    $scope.num = 122212111221121212;
    $scope.filtered = $filter('currency')($scope.num);
    alert($scope.filtered)
});

Keep in mind that the $filter service is quite easy to extend too.

myApp.filter('customCurrency', function() { 

    return function(input, symbol, place) {

    // Ensure that we are working with a number
    if(isNaN(input)) {
      return input;
    } else {

      // Check if optional parameters are passed, if not, use the defaults
      var symbol = symbol || 'EUROS';
      var place = place === undefined ? true : place;

      // Perform the operation to set the symbol in the right location
      if( place === true) {
        return symbol + input;
      } else {
        return input + symbol;
      }

    }
  }

});

myApp.controller('CalcCtrl', function ($scope, $filter) {
    $scope.num = 122212111221121212;
    $scope.filtered = $filter('customCurrency')($scope.num);
});

Demo

科技改变生活-雨落星辰 - 所有的伟大,都源于一个勇敢的开始

javascript - Format number to money format in angular - Stack Overflow

3 Answers 3

与本文相关的文章

评论列表(0)