0

Hola tengo un método que manda a llamar otros métodos, pero quisiera saber cómo hago para que se ejecuten cuando termine el método anterior, porque así como está se ejecutan todos casi al mismo tiempo, les dejo cómo tengo el código sobre eso:

 saveDatos() {
    this.guardarCV();
    this.guardarXP();
    this.guardarEdu();
    this.guardarHab();
    this.guardarIdiom();
 }

Agrego lo que tienen los demás métodos por si es de ayuda, esos métodos los ocupo para suscribir mis datos y guardarlos en mi BD, gracias de antemano por la ayuda.

guardarCV() {
    this.curriculumsService.saveCurriculum(this.cv).subscribe(
      res => {
        console.log(res);
      },
      err => {
        console.error(err);
        alert("Hubo un error al guardar los datos, intentelo de nuevo");
      }
    )
  }

guardarXP() {
    for (let xp of this.xpArray) {
      delete xp.id;
      this.experienciasService.saveExperiencia(xp).subscribe(
        res => {
          console.log(res);
        },
        err => {
          console.error(err);
        }
      )
    }
  }

guardarEdu() {
    for (let edu of this.eduArray) {
      delete edu.id;
      this.educacionesService.saveEducacion(edu).subscribe(
        res => {
          console.log(res);
        },
        err => {
          console.error(err);
        }
      )
    }
  }

guardarHab() {
    for (let hab of this.habArray) {
      delete hab.id;
      this.habilidadesService.saveHabilidad(hab).subscribe(
        res => {
          console.log(res);
        },
        err => {
          console.error(err);
        }
      )
    }
  }

guardarIdiom() {
    for (let idiom of this.idiomArray) {
      delete idiom.id;
      this.idiomasService.saveIdioma(idiom).subscribe(
        res => {
          console.log(res);
        },
        err => {
          console.error(err);
        }
      )
    }
  }

Si algo me falta, por favor díganme para modificarlo

14
  • para ayudar tenemos que saber que retornan cada funcion Commented el 22 jul. 2019 a las 20:55
  • Ya agregue esa parte Commented el 22 jul. 2019 a las 21:12
  • se deben ejecutar secuencial mente ??? los métodos o solo se debe ejecutar el primero y los otros no importa el orden ? Commented el 22 jul. 2019 a las 21:15
  • Quiero ejecutar uno después de que termine el anterior, en el orden que están Commented el 22 jul. 2019 a las 21:16
  • Mejor dicho de forma secuencial primero uno apenas termine el primero que se ejecute el segundo y asi para todos ? Commented el 22 jul. 2019 a las 21:18

3 respuestas 3

2

Según lo que me dices en los comentarios esto te puede servir , Lo que puedes hacer es que cuando se ejecute el primer método lanzar el segundo y cuando termine el segundo lazar el tercero y así sucesivamente.

        saveDatos() {
            this.guardarCV(); // ejecutas el primero
         }

        guardarCV() {
            this.curriculumsService.saveCurriculum(this.cv).subscribe(
              res => {
                console.log(res);
                this.guardarXP(); // ejecutas el segundo
              },
              err => {
                console.error(err);
                alert("Hubo un error al guardar los datos, intentelo de nuevo");
              }
            )
          }

        guardarXP() {
            const xpArrayLength = this.xpArray.length;
            for (let index = 0; index < this.xpArray.length; index++) {
              delete xp.id;
              this.experienciasService.saveExperiencia(this.xpArray[index]).subscribe(
                res => {
                  console.log(res);
                  if(xpArrayLength === index - 1){
                    this.guardarEdu(); // ejecutas el tercero
                  }
                },
                err => {
                  console.error(err);
                }
              )
            }
          }

        guardarEdu() {
            const eduArrayLength = this.eduArray.length;
            for (let index = 0; index < this.eduArray.length; index++) {
              delete edu.id;
              this.educacionesService.saveEducacion(this.eduArray[index]).subscribe(
                res => {
                  console.log(res);
                  if(eduArrayLength === index - 1){
                   this.guardarHab(); // ejecutas el cuarto
                  }
                },
                err => {
                  console.error(err);
                }
              )
            }
          }

        guardarHab() {
 const habArrayLength = this.habArray.length;
            for (let index = 0; index < this.habArray.length; index++) {
              delete hab.id;
              this.habilidadesService.saveHabilidad(hab).subscribe(
                res => {
                  console.log(res);
                  if(habArrayLength === index - 1){
                   this.guardarIdiom(); // ejecutas el quinto 
                  }
                },
                err => {
                  console.error(err);
                }
              )
            }
          }

        guardarIdiom() {
            for (let idiom of this.idiomArray) {
              delete idiom.id;
              this.idiomasService.saveIdioma(idiom).subscribe(
                res => {
                  console.log(res);
                },
                err => {
                  console.error(err);
                }
              )
            }


          }

Typescript tiene una particularidad y es que ejecuta los métodos de forma asíncrona para que se vaya cargando de forma paralela la información, lo que hice fue decirle a el primer método que cuando termine me muestre el segundo y así para los otros.

Edita la respuesta agregue una validación para saber cuando terminan los for internos y así poder ejecutar el siguiente método

4
  • No podría hacer eso, ya que de esa forma me ejecutaría los métodos que están dentro del for varias veces. Commented el 22 jul. 2019 a las 21:24
  • Dejame edito la respuesta Commented el 22 jul. 2019 a las 21:25
  • Lo que puedes hacer es validar cuando termina tu for y asi ejecutar el siguiente metodo Commented el 22 jul. 2019 a las 21:42
  • muestrame como tienes los metodos en el servicio experienciasService? Commented el 22 jul. 2019 a las 21:42
0

Lo que tienes que hacer es usar el metodo flatMap de RxJs y encadenar todas las peticiones, y forkJoin para hacer que cada metodo consolide todas las subpeticiones en una sola, asi:

guardarCV() {
  return this.curriculumsService.saveCurriculum(this.cv);
}

guardarXP() {
  return forkJoin(
    this.xpArray.map(xpItem => this.experienciasService.saveExperiencia(xpItem))
  );
}

guardarEdu() {
  return forkJoin(
    this.eduArray.map(eduItem => this.educacionesService.saveEducacion(eduItem))
  );
}

guardarHab() {
  return forkJoin(
    this.habArray.map(habItem => this.habilidadesService.saveHabilidad(habItem))
  );
}

guardarIdiom() {
  return forkJoin(
    this.idiomArray.map(idiomItem => this.idiomasService.saveIdioma(idiomItem))
  );
}

saveDatos() {
  this.guardarCV()
    .pipe(
      flatMap(() => guardarXP()),
      flatMap(() => guardarEdu()),
      flatMap(() => guardarHab()),
      flatMap(() => guardarIdiom())
    )
    .subscribe(
      res => {
        console.log('Se guardo todo con exito', res);
      },
      err => {
        console.error('Ocurrio un error', err);
      }
    );
}

De esta manera se ejecuta todo de forma secuencial y una sola vez

5
  • 2
    El forkJoin no consolida las peticiones en una sola sino que las maneja en paralelo. Aún tienes que enviarlas todas y el navegador es muy probable que limite la cantidad que puedes enviar simultáneamente. En la forma como está planteado puede conducir a conclusiones erroneas.
    – devconcept
    Commented el 22 jul. 2019 a las 21:30
  • El forkJoin "consolida" todas las peticiones que recibe como parametro en un solo "observable", internamente resuelve todas las peticiones de forma individual, el hecho de que se limite o no por el navegador es una cuestion de logica de negocio, mas no de la funcionalidad del codigo Commented el 22 jul. 2019 a las 21:34
  • De esa forma está mejor planteado. Recuerda que a las cadenas individuales se les pueden añadir operadores y cambiar el resultado final. Los navegadores no limitan las peticiones por una cuestión de lógica de negocio, lo hacen de manera automática por servidores o proxy. Es lo que se conoce como waterfall. Puedes intentar enviar muchas peticiones al mismo servidor y ver el efecto en la pestaña Network o en esta pregunta stackoverflow.com/questions/985431/…
    – devconcept
    Commented el 22 jul. 2019 a las 22:02
  • O sea que ya no necesito utilizar el subscribe si lo pongo así? Y sobre lo del navegador, eso quiere decir que en alguno puede no funcionar? Commented el 22 jul. 2019 a las 22:06
  • @CesarPalos Siempre funcionará pero también significa que no enviará todas las peticiones a la vez. Deberías considerar crear un endpoint que te procese todos los datos a la vez en lugar de muchas peticiones individuales. El subscribe si tienes que ponerlo pero en un sólo método que contiene todas las llamadas encadenadas como es el saveDatos
    – devconcept
    Commented el 23 jul. 2019 a las 13:10
0

Se puede usar una nueva promesa dentro del observable original, y luego llamar a otro método cuando este acabe:

 saveDatos() {
    this.guardarCV().then(res => this.guardarXP());
 }

guardarCV() {
    this.curriculumsService.saveCurriculum(this.cv).subscribe(
      res => {

        return new Promise((resolve, reject) => {
              console.log(res);
              resolve();
        });
      },
      err => {
        console.error(err);
        alert("Hubo un error al guardar los datos, intentelo de nuevo");
      }
    )
  }

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.