input模型在更改时从整数更改为string

有一种基于input模型的价格范围/评级function。 在加载时,当它从后端设置时,它以一个整数开始,但是当你键入它时,它将变成一个string。 Angular有没有什么方法将input的值声明为整数?

HTML:

<input type="text" name="sellPrice" id="sellPrice" class="sell-price" data-ng-model="menu.totalPrice" data-ng-change="updateMenuPriceRange()"required> 

JS:

 $scope.updateAggregatePricing(); if ($scope.menu.totalPrice === 0) { $scope.menuPriceRange = ""; } else if ($scope.menu.totalPrice < 10) { $scope.menuPriceRange = "$"; } else if ($scope.menu.totalPrice >= 10 && $scope.menu.totalPrice <= 12.50) { $scope.menuPriceRange = "$$"; } else if ($scope.menu.totalPrice >= 12.51 && $scope.menu.totalPrice < 15) { $scope.menuPriceRange = "$$$"; } if ($scope.menu.totalPrice >= 15) { $scope.menuPriceRange = "$$$$"; } else { $scope.menuPriceRange = ""; } 

3 Solutions collect form web for “input模型在更改时从整数更改为string”

我知道我迟到了,但我想我会发布这个答案,因为其他人可能仍然在寻找替代品。

你可以通过使用AngularJS指令链接函数来解决这个问题。 代码:

 var myMod = angular.module('myModule', []); myMod.directive('integer', function(){ return { require: 'ngModel', link: function(scope, ele, attr, ctrl){ ctrl.$parsers.unshift(function(viewValue){ return parseInt(viewValue, 10); }); } }; }); 

然后,您可以在input元素上使用此伪指令,以确保input的任何值都被parsing为一个整数。 (显然这个例子没有validationinput,以确保input的内容实际上是一个整数,但是你可以很容易地使用正则expression式来实现这个例子)

 <input type="text" ng-model="model.value" integer /> 

有关这个主题的更多信息可以在AngularJS文档的窗体上find,就在“自定义validation”部分: http : //docs.angularjs.org/guide/forms 。

编辑:更新parseInt()调用包含基数10,如adam0101build议

是的,使用typesnumberinput:

 <input type="number" name="sellPrice" ...> 

在我的条件之前,以整数parsing模型。

 $scope.menu.totalPrice = parseInt($scope.menu.totalPrice, 10); 
  • 在任何低于10的IE版本中,XMLHttpRequest访问被AngularJS拒绝
  • 如何检查一个有angular度的$ q承诺是否被解决
  • 用bower添加ui.bootstrap依赖
  • 如何将AngularUI集成到AngularJS?
  • 如何决定何时使用ngView或ngInclude?
  • 用Eclipse IDEconfigurationangularjs
  • angular度js未知提供者错误angular-animate
  • 使用$ locationredirect到AngularJS中的新页面