JSFiddle - React, Tailwind, and code Playground

by Arnaud

HTML

<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.0.2/angular.min.js"></script>
<div ng-app>
    <form>
        <div class="item">
            <label>montant:</label>
            <input type="range" id="loan" name="loan" ng-model="one" min="10000" max="1000000" step="10000" value="10000">
            <h1>{{one}}</h1>
        </div>
        <hr>
        <div class="item">
            <label>Duree en années</label>
            <input type="range" id="month" name="month" ng-model="two" min="1" max="60" step="1" value="1">
            <h1>{{two}}</h1>
        </div>
        <hr>
            
            <div class="item">
            <label>Taux</label>
            <input type="range" id="taux" name="taux" ng-model="three" min="1" max="60" step="1" value="1">
            <h1>{{three}}</h1>
        </div>
                
        <div class="item">
            <h1>Mensualités</h1>
            <h2 ng-repeat='rate in [5]'>
              {{rate}} = {{(((one * three * (two / 12)) /1200)/12) + (one / two) | number:2}}
            </h2>
        </div>
    </form>
</div>
            
            <!--   {{rate}} = {{(((one * rate * (two / 12)) /1200)/12) + (one / two) | number:2}}-->