Buen día, me enfrento a un dilema de estructurar métodos que comprueben datos en un componente antes de mandar a la pagina siguiente.Aunque la respuesta parecía obvia; usar promesas, no parece funcionar.Tengo en mi componente un formulario simple que al dar click en un botón debe comprobar que el id de usuario exista en una base d datos(lo hago mediante un servicio q llama una API): -mi pagina html:
<form autocomplete="off" (ngSubmit)="validarfrm(forma)" #forma="ngForm">
<div class="form-group row">
<div class="col-8">
Periodo de: <input type="text" class="form-control" name="txtdias" value="60"
(keyup)="mandaDias(dias.value)" [ngModel]="modelo.txtdias" [class.is-invalid]="false"
#dias="ngModel" /> dias
<br>Su id
Cliente:<input type="text" class="form-control" name="txtidclient" value="1"
[ngModel]="modelo.txtidclient" [class.is-invalid]="idNoValido"
#txtid="ngModel" /></div>
<div class="col-8">
<input type="submit" [routerLink]="routerAutorize" name="btnAdquirir" class="btn btn-primary " disabled
value="" #asegurabtn> <input type="button" enabled
value="Cancelar" (click)="resetActivo(asegurabtn)" class="btn btn-secondary " #cancelabtn>
</div>
</div>
</form>
-mi componente
validarfrm(frm:NgForm){
let frmcontrols=frm.value;
this.verificacliente(frmcontrols.txtidclient);
}
verificacliente(_id) {
console.log('ejcutando verificacliente( id)');
this.apiseguro.mipromesa(_id);//<- éste debe llenar un modelo con datos del usuario
console.log('en componente recojo el idregistrado');
this.idCliente=this.apiseguro.idregistrado;//<- opcion a capturar id
alert('ahora prodrá continuar nagegando');
}
-mi servicio que consulta una api
mipromesa(_idcliente:number) {
var p = new Promise(function (resolve, reject) {
// Hacer tarea asíncrona y then...
let observ =this._http.get(`${this.url3}?id=${_idcliente}`);
if ( observ!=null) {
resolve('Success!');
}
else {
reject('Fallo la promesa!');
}
});
p.then(function () {
/* hacer algo con el resultado */
console.log('promesa resolvió correcto,se llenará el modelo');
this.modelClient=this._http.get(`${this.url3}?id=${_idcliente}`);
}).catch(function () {
/* error :( */
console.log('No asignó el modelo,error en peticion');
})
}
Pero la respuesta siempre es asíncrona, necesito que el botón de mi componente espere la respuesta de la api para continuar,cómo puedo indicar una promesa síncrona?
${this.url3}?id=${_idcliente}
); observ.subscribe(resp => { this.modelClient = resp; }); .El problema es que observable entrega asíncrona la respuesta, yo necesito q espere la respuesta. No se si te refieras a declarar éste observable en el mismo componente.ts