Tuesday, June 16, 2015

Emi Calculator using AngularJS - With Event Group

<!DOCTYPE html>
<html>
<style>
  table,
  th,
  td {
    border: 1px solid grey;
    border-collapse: collapse;
    padding: 5px;
  }
 
  table tr:nth-child(odd) {
    background-color: #f1f1f1;
  }
 
  table tr:nth-child(even) {
    background-color: #ffffff;
  }
</style>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
<body>
  <div ng-app="myApp" ng-controller="myCtrl" ng-init="principle=100000;interest=14.5;tenor=10">
    Principal:
    <input type="number" ng-model="principle">
    <br> Interest:
    <input type="number" ng-model="interest">
    <br> Tenor in months:
    <input type="number" ng-model="tenor">
    <br>
    <br>
    <table>
      <TR>
        <TH>Month
          <TH>EMI
            <TH>Interest
              <TH>Principal
                <tr ng-repeat="contact in contacts">
                  <td align='right'>{{contact.O}} </td>
                  <td align='right'>{{contact.e}} </td>
                  <td align='right'>{{contact.intPerMonth}} </td>
                  <td align='right'>{{contact.prinPermonth }} </td>
                </tr>
                <TR>
                  <TH colspan="2">Total
                    <td align='right'>{{totalIntt }} </td>
                    <td align='right'>{{totalAmtt }}</td>
    </table>
  </div>
  <script>
    var app = angular.module('myApp', []);
    app.controller('myCtrl', function($scope) {
      $scope.principle = 100000;
      $scope.interest = 14.5;
      $scope.tenor = 10;
      $scope.totalIntt = 0;
      $scope.totalAmtt = 0;
      var contactss = [];
      var R = ($scope.interest / 12) / 100;
      var P = $scope.principle;
      var n = $scope.tenor;
      var e = (P * R * (Math.pow((1 + R), n)) / ((Math.pow((1 + R), n)) - 1));
      e = Math.round(e);
      var totalInt = Math.round((e * n) - P);
      var totalAmt = Math.round((e * n));
      var intPerMonth = 0;
      var prinPermonth = 0;
      for (var i = 1; i <= $scope.tenor; i++) {
        intPerMonth = (P * R);
        P = ((P) - ((e) - (intPerMonth)));
        prinPermonth = Math.round((e) - intPerMonth);
        $scope.totalIntt = totalInt;
        $scope.totalAmtt = totalAmt;
        contactss.push({
          O: i,
          e: e,
          intPerMonth: Math.round(intPerMonth),
          prinPermonth: prinPermonth
        });
      }
      $scope.contacts = contactss;
      $scope.$watch('[principle,interest,tenor]', function(newValue, oldValue) {
        var contactss = [];
        var R = ($scope.interest / 12) / 100;
        var P = $scope.principle;
        var n = $scope.tenor;
        var e = (P * R * (Math.pow((1 + R), n)) / ((Math.pow((1 + R), n)) - 1));
        e = Math.round(e);
        var totalInt = Math.round((e * n) - P);
        var totalAmt = Math.round((e * n));
        var intPerMonth = 0;
        var prinPermonth = 0;
        for (var i = 1; i <= $scope.tenor; i++) {
          intPerMonth = (P * R);
          P = ((P) - ((e) - (intPerMonth)));
          prinPermonth = Math.round((e) - intPerMonth);
          $scope.totalIntt = totalInt;
          $scope.totalAmtt = totalAmt;
          contactss.push({
            O: i,
            e: e,
            intPerMonth: Math.round(intPerMonth),
            prinPermonth: prinPermonth
          });
        }
        $scope.contacts = contactss;
      });

    });
  </script>
</body>
</html>


Result :
Principal: 
Interest: 
Tenor in months: 

MonthEMIInterestPrincipal
11067712089469
21067710949583
3106779789699
4106778619816
5106777429935
61067762210055
71067750110176
81067737810299
91067725310424
101067712710550
Total6770106770

No comments:

Post a Comment