AngularJS Tutorial For Beginners: simple calculator using angularjs

Create index.html

<!DOCTYPE html>
<html>

<body>
<div class="main">
<h3> Simple Calculator Using AngularJS</h3>

<div ng-app="myApp" ng-controller="costCtrl">
<div class="blockme">

<h1>Speed Calculation</h1>

<p>Distance(as KM) <input type="number" ng-model="d" placeholder="KM">
   Time(as Hours) <input type="number" ng-model="t">
</p>

<h4>Speed (per KM) = {{ ((d/t)) }}</h4>
</div>

<div class="blockme">

<h1>Time Calculation</h1>

<p>Distance(as KM)  <input type="number" ng-model="d">
   Speed(as Hours) <input type="number" ng-model="s">
</p>

<h4>Time(as Hours)= {{ ((d/s)) }}</h4>
</div>

<div class="blockme">

<h1>Distance Calculation</h1>

<p>Time(as Hours) <input type="number" ng-model="t">
   Speed(as Hours) <input type="number" ng-model="s">
</p>

<h4>Distance(as KM) = {{ ((t*s)) }}</h4>
</div>

<div class="blockme">

<h1>Discount Calculator</h1>
<p>Total price: <input type="number" ng-model="tot_price">
Discount Percentage: <input type="number" ng-model="dis_per"></p>

<h4>NET Price= {{ tot_price -((tot_price * dis_per)/100) | currency }}</h4>
</div>

<div class="blockme">

<h1>Simple Interest Calculator</h1>
<p>Principal Amount: <input type="number" ng-model="pa">
Rate (Per anum) <input type="number" ng-model="r">
Time <input type="number" ng-model="t">
</p>
<h4>Simple Interest= {{ ((pa*r*t)/100) | currency }}</h4>
</div>

</div>
</div>

</body>
</html>

Monday, 13 April 2015

simple calculator using angularjs

Create index.html

1 comment: