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.
4 Antworten
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.
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
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(// ...)
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)
}
)
}
Verwandte Fragen
Neue Fragen
angular
Fragen zu Angular (nicht zu verwechseln mit AngularJS), dem Webframework von Google. Verwenden Sie dieses Tag für Winkelfragen, die nicht für eine einzelne Version spezifisch sind. Verwenden Sie für das ältere AngularJS (1.x) -Webframework das AngularJS-Tag.