This is a miniCalculator project.
In this mini calculator, I am trying to calculate the operation when the "calculate" button is pressed. However, in order for the calculations to run correctly in the operations.component.ts file, I need to toggle the value of "sumaVariable". If "sumaVariable" is checked, it should be set to true so that the conditional statement can execute properly.
Here is my operations.component.ts code:
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-operaciones',
templateUrl: './operaciones.component.html',
styleUrls: ['./operaciones.component.css']
})
export class OperacionesComponent implements OnInit {
constructor() { }
ngOnInit(): void {
}
numero1 = 0; //number 1
numero2 = 0; //number 2
sumaVariable = false;
resultado = 0; //result
calcular(numero1:String, numero2:String){
if( this.sumaVariable == true){
this.suma(numero1, numero2);
}
}
// +
suma(numero1:String, numero2:String){
this.resultado = Number(numero1) + Number(numero2);
return this.resultado;
}
resta(numero1:String, numero2:String){
this.resultado = Number(numero1) - Number(numero2);
return this.resultado;
}
division(numero1:String, numero2:String){
this.resultado = Number(numero1) / Number(numero2)
return this.resultado;
}
multiplicacion(numero1:String, numero2:String){
this.resultado = Number(numero1) * Number(numero2);
return this.resultado;
}
}
And here is my operations.component.html code:
<h2>Mini Calculator</h2><br>
Enter number1: <input type="text" #numero1>
<br><br>
Enter number2: <input type="text" #numero2>
<br><br>
Operation:
<br>
Number1 = {{numero1.value}}
<br>
Number2 = {{numero2.value}}
<br> <br>
Addition:<input type="radio" name="operations" [checked]="sumaVariable">
Subtraction:<input type="radio" name="operations" #resta>
Division:<input type="radio" name="operations" #division >
Multiplication:<input type="radio" name="operations" #multiplicacion >
<br><br>
<input type="button" name="resultado" value="Calculate" (click)="calcular(numero1.value,numero2.value)">
<br><br>
<h3>Result: {{resultado}}</h3>
I would appreciate any assistance with this task.