当尝试将带小数部分的负数输入到绑定到带有angularjs的值的数字类型的输入字段时,当小数字符是逗号时,该值将转换为NaN(在我的国家/地区是标准的)。代码非常简单:
<form>
<input type="number" ng-model="positiveMoney" />
{{positiveMoney}}
</br>
<input type="number" ng-model="negativeMoney" />
{{negativeMoney}}
</form>
app.controller('MainCtrl', function($scope) {
$scope.positiveMoney = 99.89;
$scope.negativeMoney = -99.89;
});
我已经设置了plunker
演示此行为。首次运行plunker时,值会正确显示(并以逗号作为分隔符),但删除减号并重新输入时,该值不再是数字。我使用angularjs v1.2和谷歌浏览器作为我的浏览器。另一方面,当我用小数点替换逗号时,值正确显示,但这不是我所在国家(克罗地亚)的标准语言环境。
修改
最终(在Maxim Shoustin的建议的帮助下)以一种务实的方式解决了这个问题plunker:
app.directive('money', ['$filter',
function($filter) {
var MONEY_REGEXP = /^\-?\d+((\.|\,)\d{1,2})?$/;
return {
require: 'ngModel',
link: function(scope, elm, attrs, ctrl) {
ctrl.$parsers.unshift(function(viewValue) {
if (MONEY_REGEXP.test(viewValue)) {
ctrl.$setValidity('float', true);
if (typeof viewValue === "money")
return viewValue;
else
return parseFloat(viewValue.replace(',', '.'));
} else {
ctrl.$setValidity('money', false);
return undefined;
}
});
}
};
}
]);
该指令接受逗号和点作为小数分隔符。小数点后也只允许两位数。