Angularjs 在输入中舍入一个数字,但在模型中保留完整的十进制值
我希望这个标题有意义。基本上,我有一个小应用程序,可以进行各种社会保障计算。用户可以输入诸如出生日期、性别、工资等信息,然后单击“计算社会保障”,并在输入字段中显示其每月社会保障支出。如果用户选择,也可以手动输入该数字。问题是,该计算的值在应用程序的其他地方使用,因此为了准确性,我想我需要完整的十进制值。但在化妆上,我只需要它的美元价值(2046对2046.3339228485938布拉布拉布拉布拉布拉布拉布拉布拉布拉布拉布拉布拉布拉布拉布拉)。我已经看过一些关于为此编写指令的教程,但这将改变模型中的值。我的脑海中闪过这样的想法,我可能完全走错了方向,但我转向stackoverflow,希望这是一个常见的问题,我似乎找不到合适的词来形容谷歌 谢谢,Angularjs 在输入中舍入一个数字,但在模型中保留完整的十进制值,angularjs,Angularjs,我希望这个标题有意义。基本上,我有一个小应用程序,可以进行各种社会保障计算。用户可以输入诸如出生日期、性别、工资等信息,然后单击“计算社会保障”,并在输入字段中显示其每月社会保障支出。如果用户选择,也可以手动输入该数字。问题是,该计算的值在应用程序的其他地方使用,因此为了准确性,我想我需要完整的十进制值。但在化妆上,我只需要它的美元价值(2046对2046.3339228485938布拉布拉布拉布拉布拉布拉布拉布拉布拉布拉布拉布拉布拉布拉布拉)。我已经看过一些关于为此编写指令的教程,但这将改变模
John您可以创建特定的筛选器,例如:
var app = angular.module("MyApp",[]);
app.filter("rounded",function(){
return function(val,to){
return val.toFixed(to || 0);
}
});
function Ctrl($scope){
$scope.dollar=2046.3339228485938;
}
然后像这样使用它:
<div ng-controller="Ctrl">{{ dollar | rounded:2 }}</div>
{{美元|四舍五入:2}
示例:Angular具有本机号码和货币筛选器:
是的,不需要为此定制过滤器。Angular有自己的过滤器来完成这项工作。 试试这个
<div ng-controller="Ctrl">{{dollar | number:2}}</div>
{{美元|号码:2}
对于这一点,其他答案并不十分正确,因为OP希望它出现在输入字段中,但取整只显示出来
使用解析器和格式化程序是一种有效的方法。我找到了这个片段()并对其进行了修改
工作小提琴在这里:
加得太好了,@caleb!嘿,Calebboyd谢谢你的回复。我知道怎么做这样的过滤器。问题是,我需要将其作为绑定到模型的输入元素的一部分。因此,应用过滤器的任何更改也将添加到模型值中。模型值需要尽可能精确,而不是四舍五入的值。我最终使用了一个指令,该指令使用$parser和$formatters来更改交付给用户的值,而不是实际添加到模型中的值。这将不起作用,不是吗?
.directive('inputCurrency', function ($filter, $locale) {
return {
terminal: true,
restrict: 'A',
require: '?ngModel',
link: function (scope, element, attrs, ngModel) {
if (!ngModel)
return; // do nothing if no ng-model
// get the number format
var formats = $locale.NUMBER_FORMATS;
// fix up the incoming number to make sure it will parse into a number correctly
var fixNumber = function (number) {
if (number) {
if (typeof number !== 'number') {
number = number.replace(',', '');
number = parseFloat(number);
}
}
return number;
}
// function to do the rounding
var roundMe = function (number) {
number = fixNumber(number);
if (number) {
return $filter('number')(number, 2);
}
}
// Listen for change events to enable binding
element.bind('blur', function () {
element.val(roundMe(ngModel.$modelValue));
});
// push a formatter so the model knows how to render
ngModel.$formatters.push(function (value) {
if (value) {
return roundMe(value);
}
});
// push a parser to remove any special rendering and make sure the inputted number is rounded
ngModel.$parsers.push(function (value) {
return value;
});
}
};
});