如何在Angular.js中解析Int

Question

可能，这是最简单的事情，但是我不能在angular中将一个字符串解析为Int..

我想做的是:

<input type="text" ng-model="num1">
<input type="text" ng-model="num2">

Total: {{num1 + num2}}

如何对这些num1和num2值求和？

谢谢！

Answer 1

<input type="number" string-to-number ng-model="num1">
<input type="number" string-to-number ng-model="num2">

Total: {{num1 + num2}}

在js中:

parseInt($scope.num1) + parseInt($scope.num2)

Answer 2

选项1（通过控制器）：

angular.controller('numCtrl', function($scope, $window) {
   $scope.num = parseInt(num , 10);
}

选项2（通过自定义过滤器）：

app.filter('num', function() {
    return function(input) {
       return parseInt(input, 10);
    }
});

{{(num1 | num) + (num2 | num)}}

选项3（通过表达式）：

首先在控制器中声明以下内容：

$scope.parseInt = parseInt;

然后：

{{parseInt(num1)+parseInt(num2)}}

选项4（从raina77ow开始）

{{(num1-0) + (num2-0)}}

Answer 3

您不能（至少目前）在角度表达式中使用parseInt，因为它们不是直接求值的。引用文档：

Angular不使用JavaScript的eval（）来计算表达式。相反，Angular的＜code＞$parse＜/code＞服务处理这些表达式。

角度表达式不能访问全局变量，如< code>window 、< code>document或< code>location。这种限制是有意的。它防止对全局状态的意外访问——这是细微错误的常见来源。

因此，您可以在控制器中定义total（）方法，然后在表达式中使用它：

// ... somewhere in controller
$scope.total = function() { 
  return parseInt($scope.num1) + parseInt($scope.num2) 
}

// ... in HTML
Total: {{ total() }}

尽管如此，对于像数字相加这样简单的操作来说，这似乎是相当庞大的。另一种方法是用< code>-0 op转换结果:

Total: {{num1-0 + (num2-0)|number}}

...但这显然不会解析 Int 值，只会将它们转换为数字（如果此强制转换导致 NaN，|数字过滤器会防止显示 null）。因此，请选择适合您特定情况的方法。