AngularJS 格式化数字计算

function MyCtrl($scope) {$scope.var = {"value":1000.36};$scope.$watch('var.value', function(val) {$scope.numbericVal = accounting.unformat(val);});}然后，在您的视图中使用 numericVal，如下所示:{{numbericVal * 2}}示例:http://jsfiddle.net/1syh7cne/7/另一个 RAW 示例，每当值更改时使用回调函数:http://jsfiddle.net/1syh7cne/9/我使用这些属性定义了一个传递对象和当前数值的函数.请注意，您可以只解析传递对象的 val 而不是信任函数中的第二个参数.var invoker = $parse(attrs.updateFunc);调用者(范围，{编号:普通编号})；看看吧 - 我想你会看到我在那里做了什么.但正如我所说 - 这是一个可能的解决方案的总体方向.Yesterday, I am having trouble on how to make a formatted number in my number fields but now that I achieve it, I am having problem on how to do the calculation.index.html<div ng-controller="MyCtrl"> <input ng-model="var.value" class="integers" symbol="°" /> <br /><br /> {{var.value * 100}}</div>app.jsvar myApp = angular.module('myApp',['ui.numeric']);angular.module('ui.numeric', []).directive('integers', function() {return { require: 'ngModel', restrict: 'EACM', link: function(scope, element, attrs, modelCtrl) { scope.$watch(element, function() { var formatted_number = accounting.formatMoney(element.val(),"", 2,",",".","%s%v"); modelCtrl.$setViewValue(formatted_number); modelCtrl.$render(); }); element.bind('blur', function() { var formatted_number = accounting.formatMoney(element.val(),"", 2,",",".","%s%v"); modelCtrl.$setViewValue(formatted_number); modelCtrl.$render(); scope.$apply(); }); element.bind('focus', function() { var plainNumber = accounting.unformat(element.val()) if(plainNumber == "0") plainNumber = ""; modelCtrl.$setViewValue(plainNumber); modelCtrl.$render(); scope.$apply(); console.log("I am focused!") }); }};});function MyCtrl($scope) { $scope.var = {"value":1000.36};}It works when the value of the field is less than a thousand but when I reach 1000, the number would be formatted with comma 1,000 and it becomes string and can't do anymore calculations.All I want is to properly format my number fields(for display) but retain the true value to do calculations without using separate variable in each number field.Please see the fiddle. Thanks!http://jsfiddle.net/aldesabido/1syh7cne/6/updated fiddle:http://jsfiddle.net/aldesabido/1syh7cne/14/Solution:changed the modelCtrl.setViewValue(number) to modelCtrl.viewValue(number) so that the display only will be affected not the actual value (not sure about this workaround though.).http://jsfiddle.net/aldesabido/1syh7cne/18/Thanks for the help guys! 解决方案 The only solution I can think of is to watch for changes in {{ var.value }} on the controller:function MyCtrl($scope) { $scope.var = {"value":1000.36}; $scope.$watch('var.value', function(val) { $scope.numbericVal = accounting.unformat(val); });}And then, use numericVal in your view like this: {{numbericVal * 2}}Example:http://jsfiddle.net/1syh7cne/7/Another RAW example that using callback function whenever the value gets changed:http://jsfiddle.net/1syh7cne/9/I've used the attributes to define a function that pass the object and the current numeric value. Note that you can just parse the val of the passed object instead of trusting the second parameter in the function. var invoker = $parse(attrs.updateFunc);invoker(scope, {number: plainNumber});Just take a look - I think you'll see what I did there. But as I said - It's a general direction for a possible solution. 这篇关于AngularJS 格式化数字计算的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！ 上岸，阿里云！