Jak wykonać nowe wywołanie interfejsu API, gdy poprzednie zakończyło się pomyślnie?

Nov 25 2020

Jestem nowy w angular i rxjs i mam następujący scenariusz, w którym potrzebuję, aby po wywołaniu api udało się wykonać nowe wywołanie, w kontekście angular / rxjs Nie wiem jak to zrobić to

handler(): void {
  this.serviceNAme
    .createDirectory(this.path)
    .pipe(
      finalize(() => {
        this.someProperty = false;
      })
    )
    .subscribe(
      (data) => console.log(data),
      (error) => console.error(error.message)
    );
}

Jaki jest właściwy sposób wykonania nowego wywołania interfejsu API, gdy poprzednie się powiodło?

Odpowiedzi

2 adrisons Nov 26 2020 at 15:07

Rozumiem, że masz a serviceOnei serviceTwo. I chcesz zadzwonić, serviceTwokorzystając z pobranych danych z serviceOne.

Używając rxjs switchMap możesz przekierować jeden obserwowalny do drugiego.

    handler(): void {
        this.serviceOne
            .createDirectory(this.path)
            .pipe(
                switchMap(serviceOneResult => {
                    // transform data as you wish
                    return this.serviceTwo.methodCall(serviceOneResult);
                })
            )
            .subscribe({
                next: serviceTwoResult => {
                    // here we have the data returned by serviceTwo
                },
                error: err => {},
            });
    }

Jeśli nie musisz przekazywać danych z serviceOnedo, serviceTwoale chcesz, aby były one uzupełnione razem, możesz użyć rxjs forkJoin .

    handler(): void {
        forkJoin([
            this.serviceOne.createDirectory(this.path), 
            this.serviceTwo.methodCall()
        ])
        .subscribe({
            next: ([serviceOneResult, serviceTwoResult]) => {
                // here we have data returned by both services
            },
            error: err => {},
        });
    }
1 DigitalDrifter Nov 26 2020 at 04:21

Używając aysnci awaitmożesz:

async handler(): void {
  await this.serviceNAme
    .createDirectory(this.path)
    .pipe(
      finalize(() => {
        this.someProperty = false;
      })
    )
    .subscribe(
      (data) => console.log(data),
      (error) => console.error(error.message)
    );

   // Do second api call
}
1 MrkSef Nov 26 2020 at 05:00

Jest kilka wskazówek, jak to zrobić:

Scenariusz 1

Twoje dwa wywołania interfejsu API usługi są niezależne, po prostu chcesz, aby jeden został uruchomiony, a potem następny

 const serviceCall1 = this.serviceName.createDirectory(this.path);
 const serviceCall2 = this.serviceName.createDirectory(this.otherPath);

 concat(serviceCall1 , serviceCall2).subscribe({
   next: console.log,
   error: err => console.error(err.message),
   complete: () => console.log("service call 1&2 complete")
 });

Scenariusz nr 2

Twoje dwa połączenia są od siebie zależne, więc potrzebujesz wyniku pierwszego, zanim zaczniesz drugi

 this.serviceName.getDirectoryRoot().pipe(
   switchMap(root => this.serviceName.createDirectoryInRoot(root, this.path))
 ).subscribe({
   next: console.log,
   error: err => console.error(err.message),
   complete: () => console.log("service call 1 used to create service call 2, which is complete")
 });

Będziesz potrzebował scenariusza nr 2 , ponieważ zrobiony w ten sposób błąd w pierwszym wywołaniu będzie oznaczał, że żaden wynik nie zostanie wysłany do switchMap, a drugie połączenie nigdy nie zostanie wykonane.