Question

我想计算anagularjs中的值之和。

1）在文本框中，如果我输入2，它应该乘以2000，结果将是 4000 。

2）在第二行id中我输入3，它应该乘以100，结果将 300 。

2）与第三行id相同，我输入4，它应该乘以50，结果将 200 。

3）所以 4000 + 300 + 200 = 4500 结果应该完全到位。

Multiply工作正常。但是如何计算这里的总金额。如果我 4500 值，是否可以用＆＃34; Four Thousand Five Hundrad＆＃34;

等单词显示数量

＆＃13;

<table>
  <tr>
    <th colspan="3">Details of Cash</th>
  </tr>
  <tr>
    <td>Cash Notes</td>
    <td>Amount in Rs.</td>
  </tr>
  <tr>
    <td><input type="text" ng-model="amount" id="textBox2">X 2000</td>
    <td>{{ (+amount) * 2000}}</td>
    
  </tr>
  <tr>
    <td><input type="text" ng-model="amount3" id="textBox2">X 100</td>
    <td>{{ (+amount3) * 100}}</td>
    
  </tr>
  <tr>
    <td><input type="text" ng-model="amount4" id="textBox2">X 50</td>
    <td>{{ (+amount4) * 50}}</td>
    
  </tr>
  
  <tr>
    <td>Total</td>
    <td>{{total}}</td>
    
  </tr>
</table>

＆＃13;

Answer 1

在变量上添加某种观察者，并在变化时重新计算总数。我会用ng-change来做这件事。然后简单地为此调用一个通用函数。这是一个演示：

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
  $scope.calcTotal = function() {
    $scope.total = ($scope.amount || 0) * 2000 + ($scope.amount3 || 0) * 100 + ($scope.amount4 || 0) * 50;
  }
});

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>

<body>

  <div ng-app="myApp" ng-controller="myCtrl">

    <table>
      <tr>
        <th colspan="3">Details of Cash</th>
      </tr>
      <tr>
        <td>Cash Notes</td>
        <td>Amount in Rs.</td>
      </tr>
      <tr>
        <td><input type="text" ng-change="calcTotal()" ng-model="amount" id="textBox2">X 2000</td>
        <td>{{ (+amount) * 2000}}</td>
      </tr>
      <tr>
        <td><input type="text" ng-change="calcTotal()" ng-model="amount3" id="textBox2">X 100</td>
        <td>{{ (+amount3) * 100}}</td>
      </tr>
      <tr>
        <td><input type="text" ng-change="calcTotal()" ng-model="amount4" id="textBox2">X 50</td>
        <td>{{ (+amount4) * 50}}</td>
      </tr>
      <tr>
        <td>Total</td>
        <td>{{total}}</td>
      </tr>
    </table>

  </div>

</body>

</html>

angularjs中列值的总和

1 个答案: