This is a miniCalculator project.

I want to calculate the operation when I press the button "calculate", but i need to change the value "sumaVariable" when this is checked, so if "sumaVariable" is checked is = true and the "if" of operations.component.ts can run correctly.

My operations.component.ts:

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;
}

}

My operations.component.html:

<h2>MiniCalculadora</h2><br>

  Introduce numero1: <input type="text" #numero1>
  <br><br>
  Introduce numero2: <input type="text" #numero2>

<br><br>
  Operación:
<br>
 Numero1 = {{numero1.value}}
<br>
 Numero2 = {{numero2.value}}

 <br> <br>
 Suma:<input type="radio" name="operaciones" [checked]="sumaVariable">&nbsp;&nbsp;&nbsp;
 Resta:<input type="radio" name="operaciones" #resta>&nbsp;&nbsp;&nbsp;
 Division:<input type="radio" name="operaciones" #division >&nbsp;&nbsp;&nbsp;
 Multiplicacion:<input type="radio" name="operaciones" #multiplicacion >&nbsp;&nbsp;

 <br><br>
 <input type="button" name="resultado" value="Calcular"  (click)="calcular(numero1.value,numero2.value)">
 <br><br>
<h3>Resultado: {{resultado}}</h3>

Any help is appreciated.

CodePudding user response：

Suma:<input type="radio" name="operaciones" [checked]="sumaVariable" (change)=onChange($event)>

  sumaVariable: boolean = false;

  onChange(event:any) {
    console.log(this.sumaVariable)
    this.sumaVariable = true;
    if( this.sumaVariable === true){
      console.log('test')
    }
  }