Discussion:
Formatting money fields to EU compatiblem but how?
Dan Dean
2013-08-30 16:00:29 UTC
Permalink
Hello,

I found a example how to format numeric values (doubles) with proper
format, or believed so :) I have a filter like following

/**
* Created with JetBrains WebStorm.
*/
angular.module('filters').filter('money', function(input, curSymbol,
decPlaces,
thouSep, decSep) {

var curSymbol = curSymbol || ""; <!-- Symbol not needed -->
var decPlaces = decPlaces || 2;
var thouSep = thouSep || " ";
var decSep = decSep || ",";

// Check for invalid inputs
var out = isNaN(input) || input === '' || input === null ? 0.0 :
input;

//Deal with the minus (negative numbers)
var minus = input < 0;
out = Math.abs(out);
out = angular.filter.number(out, decPlaces);

// Replace the thousand and decimal separators.
// This is a two step process to avoid overlaps between the two
if(thouSep != " ") out = out.replace(/\ /g, "T");
if(decSep != ",") out = out.replace(/\,/g, "D");
out = out.replace(/T/g, thouSep);
out = out.replace(/D/g, decSep);

// Add the minus and the symbol
if(minus){
return "-" + curSymbol + out;
}
else{
return curSymbol + out;
}
});

and a small tester to this question

<!doctype html>
<html ng-app>
<head>
<script
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js">
</script>
</head>
<body>
<div ng-controller="Ctrl">
<input ng-model="Field" type="text"><br>
No filter: {{Field}}<br>
Reverse: {{Field|money}}<br>
</div>
</body>
</html>

BUT I haven't get it working it throws error
1 Error: Unknown provider: moneyFilterProvider <- moneyFilter

Can anyone please show what is wrong?

Best Regards Dan
--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+***@googlegroups.com.
To post to this group, send email to ***@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.
Raul Vieira
2013-08-30 20:48:23 UTC
Permalink
Have considered using the built in currency filter?

{{avalue | currency}}

You should be able to control the number of decimal places by piping it the the number filter.

Raul

Sent from my iPhone
Post by Dan Dean
Hello,
I found a example how to format numeric values (doubles) with proper format, or believed so :) I have a filter like following
/**
* Created with JetBrains WebStorm.
*/
angular.module('filters').filter('money', function(input, curSymbol, decPlaces,
thouSep, decSep) {
var curSymbol = curSymbol || ""; <!-- Symbol not needed -->
var decPlaces = decPlaces || 2;
var thouSep = thouSep || " ";
var decSep = decSep || ",";
// Check for invalid inputs
var out = isNaN(input) || input === '' || input === null ? 0.0 : input;
//Deal with the minus (negative numbers)
var minus = input < 0;
out = Math.abs(out);
out = angular.filter.number(out, decPlaces);
// Replace the thousand and decimal separators.
// This is a two step process to avoid overlaps between the two
if(thouSep != " ") out = out.replace(/\ /g, "T");
if(decSep != ",") out = out.replace(/\,/g, "D");
out = out.replace(/T/g, thouSep);
out = out.replace(/D/g, decSep);
// Add the minus and the symbol
if(minus){
return "-" + curSymbol + out;
}
else{
return curSymbol + out;
}
});
and a small tester to this question
<!doctype html>
<html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js">
</script>
</head>
<body>
<div ng-controller="Ctrl">
<input ng-model="Field" type="text"><br>
No filter: {{Field}}<br>
Reverse: {{Field|money}}<br>
</div>
</body>
</html>
BUT I haven't get it working it throws error
1 Error: Unknown provider: moneyFilterProvider <- moneyFilter
Can anyone please show what is wrong?
Best Regards Dan
--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.
--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+***@googlegroups.com.
To post to this group, send email to ***@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.
Dan Dean
2013-08-31 11:03:49 UTC
Permalink
Hello,

I tried to use currency filter but couldn't find a clear documentation of
it.
So, didn't get proper result.

Does anyone know where to find documentation to this currency filter?

Dan
Post by Raul Vieira
Have considered using the built in currency filter?
{{avalue | currency}}
You should be able to control the number of decimal places by piping it
the the number filter.
Raul
Sent from my iPhone
Hello,
I found a example how to format numeric values (doubles) with proper
format, or believed so :) I have a filter like following
/**
* Created with JetBrains WebStorm.
*/
angular.module('filters').filter('money', function(input, curSymbol, decPlaces,
thouSep, decSep) {
var curSymbol = curSymbol || ""; <!-- Symbol not needed -->
var decPlaces = decPlaces || 2;
var thouSep = thouSep || " ";
var decSep = decSep || ",";
// Check for invalid inputs
var out = isNaN(input) || input === '' || input === null ? 0.0 : input;
//Deal with the minus (negative numbers)
var minus = input < 0;
out = Math.abs(out);
out = angular.filter.number(out, decPlaces);
// Replace the thousand and decimal separators.
// This is a two step process to avoid overlaps between the two
if(thouSep != " ") out = out.replace(/\ /g, "T");
if(decSep != ",") out = out.replace(/\,/g, "D");
out = out.replace(/T/g, thouSep);
out = out.replace(/D/g, decSep);
// Add the minus and the symbol
if(minus){
return "-" + curSymbol + out;
}
else{
return curSymbol + out;
}
});
and a small tester to this question
<!doctype html>
<html ng-app>
<head>
<script src="
https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js">
</script>
</head>
<body>
<div ng-controller="Ctrl">
<input ng-model="Field" type="text"><br>
No filter: {{Field}}<br>
Reverse: {{Field|money}}<br>
</div>
</body>
</html>
BUT I haven't get it working it throws error
1 Error: Unknown provider: moneyFilterProvider <- moneyFilter
Can anyone please show what is wrong?
Best Regards Dan
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an
.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.
--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+***@googlegroups.com.
To post to this group, send email to ***@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.
Raul Vieira
2013-08-31 12:42:09 UTC
Permalink
It's actually pretty straight forward and not much more than what I've shown:

http://docs.angularjs.org/api/ng.filter:currency

Here's number filter:

http://docs.angularjs.org/api/ng.filter:number
Post by Dan Dean
Hello,
I tried to use currency filter but couldn't find a clear documentation of it.
So, didn't get proper result.
Does anyone know where to find documentation to this currency filter?
Dan
Post by Raul Vieira
Have considered using the built in currency filter?
{{avalue | currency}}
You should be able to control the number of decimal places by piping it the the number filter.
Raul
Sent from my iPhone
Post by Dan Dean
Hello,
I found a example how to format numeric values (doubles) with proper format, or believed so :) I have a filter like following
/**
* Created with JetBrains WebStorm.
*/
angular.module('filters').filter('money', function(input, curSymbol, decPlaces,
thouSep, decSep) {
var curSymbol = curSymbol || ""; <!-- Symbol not needed -->
var decPlaces = decPlaces || 2;
var thouSep = thouSep || " ";
var decSep = decSep || ",";
// Check for invalid inputs
var out = isNaN(input) || input === '' || input === null ? 0.0 : input;
//Deal with the minus (negative numbers)
var minus = input < 0;
out = Math.abs(out);
out = angular.filter.number(out, decPlaces);
// Replace the thousand and decimal separators.
// This is a two step process to avoid overlaps between the two
if(thouSep != " ") out = out.replace(/\ /g, "T");
if(decSep != ",") out = out.replace(/\,/g, "D");
out = out.replace(/T/g, thouSep);
out = out.replace(/D/g, decSep);
// Add the minus and the symbol
if(minus){
return "-" + curSymbol + out;
}
else{
return curSymbol + out;
}
});
and a small tester to this question
<!doctype html>
<html ng-app>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.min.js">
</script>
</head>
<body>
<div ng-controller="Ctrl">
<input ng-model="Field" type="text"><br>
No filter: {{Field}}<br>
Reverse: {{Field|money}}<br>
</div>
</body>
</html>
BUT I haven't get it working it throws error
1 Error: Unknown provider: moneyFilterProvider <- moneyFilter
Can anyone please show what is wrong?
Best Regards Dan
--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.
--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.
--
You received this message because you are subscribed to the Google Groups "AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email to angular+***@googlegroups.com.
To post to this group, send email to ***@googlegroups.com.
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/groups/opt_out.
Loading...