I'm having a coin mask problem with AngularJS.
I found this thread in Stackoverflow in English. The mask works fine by typing in the input and arrives right in the controller , however when I command formatted the controller to the screen does not scroll. >
Here has an example.
- Excerpt from the directive
app.directive('format', ['$filter',
function ($filter) {
return {
require: '?ngModel',
link: function (scope, elem, attrs, ctrl) {
if (!ctrl) return;
ctrl.$formatters.unshift(function (a) {
return $filter(attrs.format)(ctrl.$modelValue)
});
ctrl.$parsers.unshift(function (viewValue) {
elem.priceFormat({
prefix: '',
centsSeparator: ',',
thousandsSeparator: '.'
});
return elem[0].value;
});
}
};
}
]);
- Page code
<!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 type="text/javascript" src="http://code.jquery.com/jquery-1.8.3.js"></script><scriptdata-require="[email protected]" src="http://code.angularjs.org/1.2.9/angular.js"data-semver="1.2.9"></script>
<script src="app.js"></script>
</head>
<body ng-controller="MainCtrl">
<div>
<br/>Original Example
<input type="text" ng-model="test" format="number" />
<pre>{{test|json}}</pre><br/>
Example 1<input type="text" ng-model="test_2" format="number" />
<pre>{{test_2|json}}</pre><br/>
Example 2<input type="text" ng-model="test_3" format="number" />
<pre>{{test_3|json}}</pre><br/>
</div>
</body>
</html>