var app = angular.module("calculatorApp", []);
app.controller("CalculatorCtrl", CalculatorCtrl);
function CalculatorCtrl() {
pleaseWork = null;
this.buttonClicked = function(button) {
if (pleaseWork = null)
{
this.secondNumber = button;
pleaseWork = "I don't know why this won't work."
} else {
this.firstNumber = button;
}
}
this.opButtonClicked = function(opButton) {
this.operationType = opButton;
}
this.equalButtonClicked = function() {
var firstNumber= parseFloat(this.firstNumber);
var secondNumber= parseFloat(this.secondNumber);
if (operationType === '+') {
this.equalButtonClicked = firstNumber + secondNumber;
}
if (operationType === '-') {
this.equalButtonClicked = firstNumber - secondNumber;
}
if (operationType === '*') {
this.equalButtonClicked = firstNumber * secondNumber;
}
if (operationType === '/') {
this.equalButtonClicked = firstNumber / secondNumber;
}
}
}
<html ng-app="calculatorApp">
<head>
<title>Calculator</title>
<script src="angular.js"></script>
<script src="app.js"></script>
</head>
<body>
<h1>Midterm Calculator</h1>
<div ng-controller = "CalculatorCtrl as ctrl">
<p>
<span ng-bind="ctrl.firstNumber"></span>
<span ng-bind="ctrl.operationType"></span>
<span ng-bind="ctrl.secondNumber"></span>
</p>
<p>
<input type="text" value="{{solution}}" readonly/>
</p>
<p>
<button ng-click="ctrl.buttonClicked('1')">1</button>
<button ng-click="ctrl.buttonClicked('2')">2</button>
<button ng-click="ctrl.buttonClicked('3')">3</button>
</p>
<p>
<button ng-click="ctrl.buttonClicked('4')">4</button>
<button ng-click="ctrl.buttonClicked('5')">5</button>
<button ng-click="ctrl.buttonClicked('6')">6</button>
</p>
<p>
<button ng-click="ctrl.buttonClicked('7')">7</button>
<button ng-click="ctrl.buttonClicked('8')">8</button>
<button ng-click="ctrl.buttonClicked('9')">9</button>
</p>
<p>
<button ng-click="ctrl.buttonClicked('0')" >0</button>
<button ng-click="ctrl.equalButtonClicked()">=</button>
<button ng-click="ctrl.opButtonClicked('+')">+</button>
</p>
<p>
<button ng-click="ctrl.opButtonClicked('-')">-</button>
<button ng-click="ctrl.opButtonClicked('*')">*</button>
<button ng-click="ctrl.opButtonClicked('/')">/</button>
</p>
</div>
</body>
</html>
The issue lies in the JavaScript if statement between the first and second numbers. Despite setting a variable ("pleaseWork") to null, it still fails to be read correctly. This has caused some frustration as I have not encountered this problem with Angular or JS before. Researching solutions mostly brings up ngifelse statements that I am hesitant to try at this point.