Ich werde eine Antwort vom folgenden Code erhalten:

this.http.post("http://localhost/angular5/user-add.php", this.myform.value, {responseType: 'json'}).subscribe(
            data => {
                console.log(data)
            }
        )

Nachdem ich das Ergebnis erhalten habe, muss ich den folgenden Code ausführen:

this.http.post("http://localhost/angular5/user.php", formData).subscribe(
            imageData => {
                console.log(imageData)
            }
        )

Ich muss diesen Code synchron ausführen. Wie macht man es synchron? Jetzt wartet der Sekundärcode nicht auf den Primärcode.

1
Test admin 17 Apr. 2018 im 15:32

4 Antworten

Beste Antwort

Am einfachsten ist wahrscheinlich async / await, ohne in das Rx-Gebiet zu gelangen (vielleicht möchten Sie dort nicht eintauchen).

async doSomething() {
   const req1 = await this.http.post("http://localhost/angular5/user-add.php", this.myform.value, {responseType: 'json'}).pipe(first()).toPromise();

   const req2 = await this.http.post("http://localhost/angular5/user.php", formData).pipe(first()).toPromise();

   console.log(req1, req2);
}

Das Schlüsselwort async bewirkt im Grunde, dass sich der Funktionskörper wie synchron verhält. Es wird immer ein Versprechen zurückgeben, daher müssen Sie möglicherweise await doSomething().

Hoffe das macht Sinn.

3
DarkNeuron 15 Feb. 2019 im 13:31

Wenn ich die Frage richtig verstehe, ist es klar, dass Sie nach der ersten Antwort (useradd) eine zweite Anfrage (Benutzer) posten müssen.

Da http.post eine Observable zurückgibt, anstatt diese direkt zu abonnieren, können Sie die erste Observable mit der zweiten Observable verketten und diese stattdessen abonnieren. switchMap (oder flatMap) scheint der Operator zu sein, den Sie benötigen.

Etwas wie das:

import { switchMap } from 'rxjs/operators';

const firstRequest = this.http.post("http://localhost/angular5/user-add.php", this.myform.value, {responseType: 'json'});

const secondRequest = switchMap( data => {
    console.log(data); //First request data. Chain it to second request.
    return this.http.post("http://localhost/angular5/user.php", formData);
});

const combinedRequest = secondRequest(firstRequest);

combinedRequest.subscribe(imageData => console.log(imageData));

Beachten Sie, dass die erste Anforderung erst ausgelöst wird, wenn Sie subscribe für die kombinierte Anforderung aufrufen

1
Anup 18 Apr. 2018 im 17:22

Sie können den asynchronen Code nicht synchronisieren. Sie können die Ausführung der zweiten Anforderung verzögern, bis die erste zurückkehrt.

Jemand in den Kommentaren schlug vor, flatMap oder switchMap zu verwenden, aber es sieht nicht so aus, als würde die zweite Anforderung den von der ersten zurückgegebenen Wert verwenden. In diesem Fall sollte ein einfaches concat funktionieren.

import { concat } from 'rxjs/observable';

const addUser$ = this.http.post(
    "http://localhost/angular5/user-add.php", 
    formValue, 
    {responseType: 'json'}
);

const postUser$ = this.http.post("http://localhost/angular5/user.php", formData);

// addUser$ will execute first, than postUser$
concat(addUser$, postUser$)
  .subscribe(// ...)
0
Tomasz Kula 17 Apr. 2018 im 12:39

Sie können Ihr Observable auch in eine Funktion konvertieren und async verwenden Ich warte

async yourMethod()
{
    //first call
    let data = await this.http.post("http://localhost/angular5/user-add.php", this.myform.value, {responseType: 'json'}).toPromise();
    console.log(data);

    //2nd call - executes after the first one
    this.http.post("http://localhost/angular5/user.php", formData).subscribe(
        imageData => {
            console.log(imageData)
        }
    )
}
0
David 17 Apr. 2018 im 13:04