在角JS添加数字

我学的角度JS和陷入了下面的代码：在角JS添加数字

<div ng-app="calculate"> 
Amount: <input type='text' data-ng-model='amount' name = 'amount' placeholder = 'Enter amount' > 
Charge: <input type='text' name = 'charge' ng-bind="charge" value="{{ amount | serviceFilter }}" > 
Total: <input type='text' value= " {{(amount)+ (amount | serviceFilter)}}" name = 'total' > 
</div> 

<script> 
    angular.module('calculate', []) 
    .filter('serviceFilter', function(){ 
    return function(amount){ 
     if(angular.isUndefined(amount)){ 
     charge = '0'; 
     }else{ 
     if(isNaN(amount)){ 
      charge = 'Invalid Data !!!'; 
     }else{ 
      if(amount < 1000){ 
      charge = '200'; 
      }else{ 
      charge = '500'; 
      } 
     } 
     } 
     return charge; 
    }; 
    }); 
</script>

当我输入金额。我收到适当的费用。但我无法加上金额并收取总金额。比方说：

Amount: 1200 
Charge: 500 
Total : 1700

我需要获得1700，而是我得到

Total: 1200 500

此外，我想知道这是否是合适的方式或有任何其他更好的方式来做到这一点。 Thankyou

来源

2015-03-25 nasor

这些都被视为字符串，将其转换为整数，然后进行添加操作。 – Arpit 2015-03-25 06:28:11

这里有几个方法可以做到这一点：

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

 
app.controller('myController', function($scope) { 
 
    $scope.strNum = '1'; 
 
    $scope.parseInt = parseInt 
 
}); 
 

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

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="app"> 
 
    <div ng-controller="myController"> 
 
    {{ strNum }} 
 
    {{ 1*strNum + 1*strNum }} 
 
    {{ parseInt(strNum, 10) + parseInt(strNum, 10) }} 
 
    {{ (strNum|num) + (strNum|num) }} 
 
    </div> 
 
<div>

来源

2015-03-25 06:53:58 DTing

您可以在serviceFilter中使用parseInt（）或将字符串值乘以1来将其转换为整数。

第一种选择：

<script> 
    angular.module('calculate', []) 
    .filter('serviceFilter', function(){ 
    return function(amount){ 
     var chargeInt; 
     if(angular.isUndefined(amount)){ 
     charge = '0'; 
     }else{ 
     if(isNaN(amount)){ 
      charge = 'Invalid Data !!!'; 
     }else{ 
      if(amount < 1000){ 
      charge = '200'; 
      }else{ 
      charge = '500'; 
      } 
     } 
     } 
     chargeInt = parseInt(charge); 
     if (isNaN(chargeInt)) 
      return charge; 
     else 
      return chargeInt; 
    }; 
    }); 
</script>

第二个选项：

<div ng-app="calculate"> 
Amount: <input type='text' data-ng-model='amount' name = 'amount' placeholder = 'Enter amount' > 
Charge: <input type='text' name = 'charge' ng-bind="charge" value="{{ amount | serviceFilter }}" > 
Total: <input type='text' value= " {{(amount)+ 1 * (amount | serviceFilter)}}" name = 'total' > 
</div>

来源

2015-03-25 06:32:41 lvarayut

这是因为，当你在文字输入绑定号码，他们被视为字符串，从而改变文本框中键入要号码。

<input type='number' data-ng-model='amount' name='amount' placeholder='Enter amount'>

并改变在过滤器中的串型数字为int

app.filter('serviceFilter', function(){ 
    return function(amount){  
     if(angular.isUndefined(amount)){ 
     charge = 0; 
     }else{ 
     if(isNaN(amount)){ 
      charge = 'Invalid Data !!!'; 
     }else{ 
      if(amount < 1000){ 
      charge = 200; 
      }else{ 
      charge = 500; 
      } 
     } 
     } 
     return charge; 
    }; 
});

或转换为intreturn parseInt(charge);像@LVarayut建议之后返回charge。

这里是Demo Plunker

做一个简单的黑客将这些字符串值，为智力，

<input type='text' value="{{ (amount-0) + ((amount | serviceFilter)-0) }}" name='total'>

(amount-0)和((amount | serviceFilter)-0)将返回一个INT，删除0将导致一个数字。

这里是Demo Plunker

来源

2015-03-25 06:47:51

在角JS添加数字

回答

相关问题