<!DOCTYPE html>
<html data-ng-app="MyApp">
<head>
<script data-require="angularjs@1.5.5" data-semver="1.5.5" src="https://code.angularjs.org/1.5.5/angular.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body data-ng-controller="InvoiceController as invoice">
<input id="inputCurr" type="number" min="0" ng-model="invoice.inputValue">
<select data-ng-model="invoice.inCurr">
<option data-ng-repeat="curr in invoice.currencies">{{curr}}</option>
</select>
<br/>
<br/>
<input id="oututCurr" type="number" min="0" ng-model="invoice.output()">
<select data-ng-model="invoice.outCurr">
<option data-ng-repeat="curr in invoice.currencies">{{curr}}</option>
</select>
</body>
</html>
var app = angular.module("MyApp", []).
controller("InvoiceController", function() {
this.currencies = ['INR', 'EUR', 'USD'];
this.inCurr = "INR";
this.outCurr = "EUR";
this.inrToForeignRates = {
INR: 1,
EUR: 0.013,
USD: 0.015
};
this.inputValue = 10;
this.outputValue = function(input, inCurr, outCurr) {
return input * this.inrToForeignRates[outCurr] / this.inrToForeignRates[inCurr];
};
this.output = function() {
return this.outputValue(this.inputValue, this.inCurr, this.outCurr);
};
});