Is there a way to automatically format the numbers I type with a $ symbol in the input field, without actually storing the $ in the model? I've tried different methods but so far, if there is already a value in the model (not null), it displays with $. However, if the input is empty or I delete everything and start over, the values are not formatted. What am I missing here? Check out this jsfiddle: http://jsfiddle.net/rmzqomzz/1/
angular.module('HelloApp', []);
function myTest() {
return {
restrict: 'EA',
require: 'ngModel',
link: function(scope, element, iAttrs, ngModel) {
console.log(iAttrs.myTest);
ngModel.$formatters.push(function(modelValue){
if(!modelValue) return;
if(iAttrs.myTest == 'money'){
return '$ '+modelValue;
}else{
return modelValue +' %';
}
});
ngModel.$parsers.push(function(viewValue){
return viewValue.replace('$', '').trim();
});
scope.$watch(
function(){
return ngModel.$modelValue;
}, function(newValue, oldValue){
console.log('value changed '+ newValue);
}, true
);
}
};
};
angular.module('HelloApp').directive('myTest', myTest);
angular.module('HelloApp').controller('HelloController', function($scope) {
$scope.mon = {'balu':null};
});
Thanks