Untitled

<!DOCTYPE html>
<html>
<head>
  <title>Proj2</title>
</head>
<body>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js"></script>
  <center>
  <div ng-app="Calculator" ng-controller="Controller as viewmodel">
    <h1>Calculator</h1>
    <button ng-click="viewmodel.calculate()">Calculate</button>
    <p>1) Addition: <b>{{ viewmodel.addition }}</b></p>
    <p>2) Subtraction: <b>{{ viewmodel.substraction }}</b></p>
    <p>3) Multiplication: <b>{{ viewmodel.multiplication }}</b></p>
    <p>4) Division: <b>{{ viewmodel.division }}</b></p>
    <p>5) Modular Division: <b>{{ viewmodel.modulardivision }}</b></p>
  </div>
</center>
  <script>
    angular.module('Calculator', []);
    angular.module('Calculator').controller('Controller', function()
    {
      var viewmodel = this;
      viewmodel.values = [2.1, 1.5, 3.7, 1.1, 1.6];
      viewmodel.calculate = function()
      {
        viewmodel.addition = viewmodel.values.reduce(function(sum, n)
        {
            return sum + n;
        }, 0).toFixed(2);
        viewmodel.substraction = viewmodel.values.reduce(function(sub, n)
        {
            return sub - n;
        }).toFixed(2);
        viewmodel.multiplication = viewmodel.values.reduce(function(mul, n)
        {
            return mul * n;
        }, 1).toFixed(2);
        viewmodel.division = viewmodel.values.reduce(function(div, n)
        {
            return div / n;
        }).toFixed(2);
        viewmodel.modulardivision = viewmodel.values.reduce(function(mod, n)
        {
            return mod % n;
        }).toFixed(2);
      };
    });
  </script>
</body>
</html>