сумма значений столбца в angularjs - PullRequest
0 голосов
/ 22 мая 2018

Я хочу вычислить сумму значения в anagularjs.

1) В поле ввода, если я введу 2, оно должно умножиться на 2000, и результат будет 4000 .

2) Во второй строке идентификатора я ввожу 3, она должна умножиться на 100, и результат будет 300 .

2) То же, что и в третьей строке идентификатора, введенного 4, он должен умножитьсяс 50, и результат будет 200 .

3) Итак, 4000 + 300 + 200 = 4500 результат должен прийти в общем месте.

Умножение работает нормально.Но как рассчитать общую сумму здесь.И если я получу 4500 значение, это возможно, чтобы показать сумму в таких словах, как "Четыре тысячи пять Hundrad"

<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>

1 Ответ

0 голосов
/ 22 мая 2018

Добавьте какой-нибудь наблюдатель к вашим переменным и пересчитайте общее количество, когда они изменятся.Я бы использовал 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>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...