1

Cuando hago:

postUsuario( usuario:Usuario): boolean {
        try {
            console.log("Dentro postUsuario.service ");
            this.http.post (this._url, usuario
                ).subscribe(data=> this.data=data); 
                console.log( "DATA" , this.data); 
            return true;  
        } catch (error) {
            console.log(error);
            return false;
        }
    }



me hace el return true sin esperar a ver el resultado de la operación. Puedo tener el Back End apagado y lo da por true aunque posteriormente en Angular consola tenga el error de post. Pero, ¿Como lo controlo? Yo envio un formulario y entiendo si recibo el return de true que lo ha hecho correctamente, y no es así.

Gracias

He realizado los cambios que me aconsejaron. He mejorado ya que ahora puedo controlar si el post de devuelve un NULL o me devuelve los datos del Usuario que se esta registrando. En Angular .ts he puesto.

onSubmit() : void {    
 this.user=this.myForm.value;
 console.log("user es => " , this.user);
 this._postUserService.postUsuario( this.user).subscribe(data=> this.data=data) 
 console.log ( "TERMINO POST. DEBE SER FINAL " );
 }

En el servicio tengo :

 postUsuario( usuario:Usuario):  Observable <boolean> {

        console.log("Dentro postUsuario.service ", usuario);
               return this.http.post (this._url, usuario).pipe(
                map((respuesta:any)=>{
                    //Aqui puedes trabajar los datos y hacer lo que quieras
                    console.log( "ver que tengo ", respuesta);
                    if(respuesta==null){
                    console.log( "Error usuario duplicado ", respuesta);
                    }else{
                    console.log( "Usuario inscrito OK", respuesta);    
                    }
                    return this.respuesta;
                }),
                catchError(err=> {
                    console.log( "Error al hacer post usuario ", err );
                    return throwError(err)
                }) 
            )

y cuando hago el envio del formulario veo por consola que hace el POST. Me escribe TERMINO POST, DEBE ESTAR BIEN Yluego los mensajes del servicio de que el usuario esta duplicado y me devuelve un NULL que es lo que le puse me devolviese en ese caso en BACK.

Supongo será asi. Ahora tengo más control sobre el retorno pero el programa no espera a ver como termina el post¿ es así?

2 respuestas 2

1

Tu estructura es incorrecta para lo que esperas. Debe ser asi:


postUsuario( usuario:Usuario): Observable<boolean> {
        
           return  this.http.post<boolean>(this._url, usuario)
                   .pipe(
                       //Se puede omitir este pipe pero de esta manera
                       // logras trabajar los datos un poco antes de entregarlos
                       // al componente que esta haciendo la peticion al servicio.
                       map((respuesta:any)=>{
                           //Aqui puedes trabajar los datos y hacer lo que quieras
                           return this.respuesta 
                       }),
                       catchError(err=> {
                           //Esto te permite capturar todos los errores 
                           // en un solo lugar. Puedes anadir aqui algun log
                           // o cualquier logica que quieras
                           return trhowError(err)
                       }) 
                   )
       
           }

Despues donde necesites el codigo lo llamas asi:


miServicio.postUsuario(unUsuario)
   .subscribe(respuestaTipoBoolean => this.datos = respuestaTipoBoolean, err=>{
   //En esta parte puedes poner una logica especifca para este componente en caso
   // de que el servicio haya capturado el error. De esta manera no complicas tu 
   // codigo

})

Nota que todo tiene que ser dentro del observable. la funcion map, catchError y trhowError necesitan importarse para que funcionen. En tu componente.ts:

import { map, catchError } from 'rxjs/operators'
import { throwError } from 'rxjs'

Este código no esta probado. Esta echo sobre la marcha.

EDICION

Para que tu logica espere la respuesta de tu backend debes organizarla de esta manera:



onSubmit() : void {    
 this.user=this.myForm.value;
 console.log("user es => " , this.user);
 this._postUserService.postUsuario( this.user).subscribe(data=>{
     //Todo lo que quieres que espere la respuesta del post
     //debe entrar en estos corchetes. 
     this.data=data

     //Por ejemplo this.mostrarFormulario = true
      
     console.log ( "TERMINO POST. DEBE SER FINAL " );
}) 

 }
4
  • Estoy aprendiendo muchas cosas en poco tiempo. Perdona si mi pregunta es demasiado facil, pero no entiendo bien "lo que hago". En mi .ts he puesto como me has comentado " console.log ( "es correcto ", this._postUserService.postUsuario( this.user).subscribe(data=> this.data=data) )" ese data es booleano como deseo me responda el metodo del service.¿no?
    – DANIEL
    el 12 feb. 2020 a las 16:39
  • Gracias. Funciona. Ahora no me ocurre como antes. Si mi usuario desde front envia a back y desde alli verifica la BBDD SQL. Si ya existe me devuelve null y puedo controlar con ello que el usuario ya existe en la BBDD con el mismo email. No lo da por ok sin esperar "Error usuario duplicado null"
    – DANIEL
    el 12 feb. 2020 a las 18:25
  • Hola @DANIEL. No hay por que pedir disculpas estamos para ayudar y se responde con gusto. Solo que trato de ser breve para ayudar a otros tambien.
    – Legna
    el 12 feb. 2020 a las 20:37
  • Actualice mi respuesta. Por favor revisa los cambios para ver si aclara tus dudas.
    – Legna
    el 12 feb. 2020 a las 20:45
-1

como estas? Trata de usar async/await en JS, podrias reemplazar por lo siguiente:

async postUsuario( usuario:Usuario): boolean {
    try {
        console.log("Dentro postUsuario.service ");
        const resp = await this.http.post (this._url, usuario
            );
        return true;  
    } catch (error) {
        console.log(error);
        return false;
    }
}

En este caso, al ser una funcion asincrona, el await indica a JS que espere hasta que esta funcion retorne su valor o pase por el catch, luego continuara por retornar el true;

4
  • Gracias por ayudarme. Pero no va. El async hace que boolean de error "The return type of an async function or method must be the global Promise<T> type.ts(1064)"
    – DANIEL
    el 11 feb. 2020 a las 20:55
  • Y el await dice "'await' has no effect on the type of this expression.ts(80007)"
    – DANIEL
    el 11 feb. 2020 a las 20:55
  • await es para promesas, no para Observables el 11 feb. 2020 a las 22:01
  • No estoy seguro, pero deberia ser posible usarasync si se pone await this.http.post(...).toPromise().
    – Legna
    el 13 feb. 2020 a las 13:49

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.