I'm having in html
<input type="text" ng-model="price" >
<h2>{{ price | currency}}</h2>
In controller
$scope.price = 10;
Which displays **$10** in h1 if i change the value in price model input.
I want the text box input to be in currency ($10 in input box as value). How to achieve this?
I'm having in html
<input type="text" ng-model="price" >
<h2>{{ price | currency}}</h2>
In controller
$scope.price = 10;
Which displays **$10** in h1 if i change the value in price model input.
I want the text box input to be in currency ($10 in input box as value). How to achieve this?
Share Improve this question edited Dec 23, 2013 at 8:35 Dhaval Marthak 17.4k6 gold badges47 silver badges69 bronze badges asked Dec 23, 2013 at 8:32 bleedCoderbleedCoder 3692 gold badges7 silver badges17 bronze badges 1- sorry about my previous answer, I wasn't read you question properly. Please try my demo of new answer below. – Daiwei Commented Dec 24, 2013 at 2:21
2 Answers
Reset to default 16You can try using formatters and parsers like
app.directive('currency', function () {
return {
require: 'ngModel',
link: function(elem, $scope, attrs, ngModel){
ngModel.$formatters.push(function(val){
return '$' + val
});
ngModel.$parsers.push(function(val){
return val.replace(/^\$/, '')
});
}
}
})
then
<input type="text" ng-model="price" currency>
Demo: Fiddle
For input I don't use ng-bind or ng-model, I always use ng-value instead.
<input type="text" ng-value="variable | currency:'US$ '" />