0

al ingresar un numero a un textbox quiero que me arroje una alerta, pero no he podido solucionarlo, al ser igual o superior a 30 debe mandar la alerta

en html es mi codigo del textbox

<input
   type="number"
   min="0"
   id="obraAv"
   [value]="obraAv"
   (input)="Alert()"
   class="form-control"
   placeholder="Avance de la obra"
   required="required"/>

este es el mensaje que quiero mostrar

<div *ngIf="showAlert" class="col-md-3 mb-2">
    <div class="alert alert-danger" ng-value="obraAv">
         <strong>Su obra civil no es asegurable</strong>
    </div>
</div>

y este es el codigo en ts

    showAlert=false;
  obraAv;
  Alert()
  {
      if(this.obraAv==30)
      {
          this.showAlert=true;
      }
      else{
          this.showAlert=false;
      }
  }

les agradecere mucho su apoyo

2 respuestas 2

0

Intenta asignadole un modelo al input utilizando ngModel y luego detectamos el cambio de ese modelo con el evento ngModelChange:

<input
   type="number"
   min="0"
   id="obraAv"
   [value]="obraAv"
   ([ngModel])="obraInput"
   (ngModelChange)="obraChange()"
   class="form-control"
   placeholder="Avance de la obra"
   required="required"/>

Entonces en el codigo cuando cambie el valor del input, verificamos si es mayor a 30 y mostramos la alerta, de lo contrario la ocultamos. Aqui el codigo completo:

@Component({
  selector: 'main-component',
   template: `
<input
       type="number"
       min="0"
       id="obraAv"
       [value]="obraAv"
       ([ngModel])="obraInput"
       (ngModelChange)="obraChange()"
       class="form-control"
       placeholder="Avance de la obra"
       required="required"/>

<div *ngIf="showAlert" class="col-md-3 mb-2">
    <div class="alert alert-danger" ng-value="obraAv">
         <strong>Su obra civil no es asegurable</strong>
    </div>
</div>

`})
export class MainComponent
{
   obraAv : String;
   showAlert : Boolean;
   obraChange()
   {
      showAlert = parseInt(obraAv) > 30);
   }
}
1
  • Hola muchas gracias, pero aun tengo un problema, al colocar la funcion no detecta el showAlert y obraAv y les agregue un this. pero aun asi no me muestra la advertencia obraAv : string; showAlert : boolean; obraChange() { this.showAlert = parseInt(this.obraAv) > 30; }
    – Ricardo
    el 6 jun. 2018 a las 15:13
0

Puedes utiliza un [(ngModel)]="variable" para tener la variable del input en tu componente, así cada que haya un cambio, ejecutas la función de Alert()

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.