1

espero que se entienda mi duda, tengo una aplicación donde hago unas llamada a la base de datos y a la hora de utilizarlos datos recibidos me salen como undefined y creo que esto se debe a la asincronia. Me he estado informando de los Callback, Promesas y async/await y he decidido usar este último para mi aplicación pero no está funcionando y no se a que se debe.

El problema lo tengo en la funcion main(). Aquí os dejo el código:

async main(){

    console.time('measuring time');
    this.objetos = await this.cargarobjetos();
    this.itemsUser = await this.cargaritemspersonaje(this.user.nombre);
    console.timeEnd('measuring time');

    console.log(this.objetos);
    console.log(this.itemsUser);
  }

El método cargarobjetos() me devuelve todos los objetos de la base de datos y su código es el siguiente:

cargarobjetos(){

    this.objetosservice.getObjetos().subscribe(objects =>{
      console.log(objects);
      return objects;
    })

  }

Y al igual, en cargaritemspersonaje() hago una llamada a la base de datos que me devuelve el id de los objetos que tiene ese personaje. Aquí el código:

cargaritemspersonaje(nombreUser){

    this.objetosusuarioservice.getObjetos(nombreUser).subscribe(mostrar =>{
      console.log(mostrar)
      return mostrar;
    })
  }

El problema de esto es que pese al async await cuando ejecuto la aplicación sigue mostrándomelos como undefined mostrandome antes los console.log del main sin esperar a que terminen de ejecutarse el resto de funciones. Aquí dejo foto: imagen del error

1
  • eso no es async/await estas usando observables que es un paradigma de asincronía distinto al de promesas que es async/await y tendrias que ver como usarlos en tu aplicación de manera adecuada.
    – hawks
    Commented el 30 mar. 2020 a las 11:06

1 respuesta 1

1

En tu caso preferiria utilizar promesas, en lugar de los observables, para trabajar con async/await. Esto lo puedes hacer de una forma muy sencilla solo haciendo los siguientes cambios:

cargarobjetos(){

    return this.objetosservice.getObjetos().toPromise();

}

y

cargaritemspersonaje(nombreUser){

   return this.objetosusuarioservice.getObjetos(nombreUser).toPromise();

}

De esta forma deberia funcionar de la forma en que estas esperando.

Esto es asi porque async/await "modifica" las promesas para llevar el codigo subsecuente a un 'await' a como si estuviese dentro de un 'then'. De forma practica, seria lo mismo que hacer lo siguiente sin async/await:

async main(){

    console.time('measuring time');
    this.cargarobjetos().then((objetos) => {
        this.objetos = objetos;
        this.cargaritemspersonaje(this.user.nombre).then((itemsUser) => {
            this.itemUser = itemUser;
            console.timeEnd('measuring time');
            console.log(this.objetos);
            console.log(this.itemsUser);
        })
    })

}

Pero claro, async/await da mas legibilidad al codigo.

1
  • en el main se puede simplificar el codigo. this.objetos = await this.cargarobjetos(); this.itemsUser = await this.cargaritemspersonaje(this.user.nombre);
    – hawks
    Commented el 30 mar. 2020 a las 13:39

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.