Làm thế nào để parseInt trong Angular.js

Question

Có lẽ, đó là điều đơn giản nhất nhưng tôi không thể phân tích một chuỗi int trong góc ..

Những gì tôi đang cố gắng để làm:

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

Total: {{num1 + num2}} 

thế nào tôi có thể tổng hợp các giá trị num1 và num2 này không?

Thnx!

Answer 1

Bạn không thể (ít nhất là ở thời điểm hiện tại) sử dụng parseInt bên trong biểu thức góc, khi chúng không được đánh giá trực tiếp. Quoting the doc:

Góc không sử dụng JavaScript eval() để đánh giá biểu thức. Thay vào đó, dịch vụ $parse của Angular xử lý các biểu thức này.

Biểu thức góc không có quyền truy cập vào các biến toàn cục như window, document hoặc location. Hạn chế này là cố ý. Nó ngăn tình cờ truy cập vào trạng thái toàn cầu - một nguồn phổ biến của lỗi tinh tế.

Vì vậy, bạn có thể định nghĩa một phương pháp total() trong điều khiển của bạn, sau đó sử dụng nó trong biểu thức:

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

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

Tuy nhiên, đó có vẻ là khá cồng kềnh cho một một thao tác đơn giản như thêm những con số. Cách khác là chuyển đổi kết quả với -0 op:

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

... nhưng điều đó sẽ rõ ràng sẽ không parseInt giá trị, chỉ đúc họ số (|number lọc sẽ ngăn không cho thấy null nếu kết quả diễn viên này trong số NaN). Vì vậy, chọn cách tiếp cận phù hợp với trường hợp cụ thể của bạn.

Answer 2

Thực hiện thao tác bên trong phạm vi đó.

<script> 
angular.controller('MyCtrl', function($scope, $window) { 
$scope.num1= 0; 
$scope.num2= 1; 


    $scope.total = $scope.num1 + $scope.num2; 

}); 
</script> 
<input type="text" ng-model="num1"> 
<input type="text" ng-model="num2"> 

Total: {{total}} 

Answer 3

Lựa chọn 1 (thông qua bộ điều khiển):

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

---

Lựa chọn 2 (thông qua bộ lọc tùy chỉnh):

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

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

---

Lựa chọn 3 (thông qua biểu hiện):

Khai báo điều này đầu tiên trong bộ điều khiển của bạn:

$scope.parseInt = parseInt; 

Sau đó:

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

---

Lựa chọn 4 (từ raina77ow)

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

Answer 4

var app = angular.module('myApp', []) 

app.controller('MainCtrl', ['$scope', function($scope){ 
    $scope.num1 = 1; 
    $scope.num2 = 1; 
    $scope.total = parseInt($scope.num1 + $scope.num2); 

}]); 

Demo: parseInt with AngularJS

Answer 5

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

Total: {{num1 + num2}} 

và trong js:

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