Reihenfolge der asynchronen HTTP-Anfragen

Question

Grundsätzlich habe ich eine Komponente mit einer Liste von Elementen und ich habe eine Detailkomponente, wo Sie ein neues Element bearbeiten oder hinzufügen können.

Nachdem ich ein Element über einen http-Dienst (this.myservice basiert auf hero.service.ts aus der Dokumentation https://angular.io/docs/ts/latest/tutorial/toh-pt6.html) zu meinem Server hinzugefügt. Dann springe ich direkt zurück zur Liste der Elementkomponenten.

Ich benutze Zone, so dass ngOnInit aufgerufen wird. Angular 2 ngOnInit not called

Das Problem ist, dass die Liste der Elemente nicht oft mit dem neuen Element aktualisiert wird. Ich nehme an, die Reihenfolge der asynchronen HTTP-Anfragen wird durcheinandergebracht.

Wie würde eine gute Lösung aussehen?

export class DetailElemComp { 
    this.myService.addElem(this.elem) 
     .subscribe(
     error => this.errorMessage = <any>error); 
    this.zone.run(() => this.router.navigate(['ListComponent'])); 
} 
export class ListOfElemComp { 
    ngOnInit() { 
     this.myService.getElems() 
      .subscribe(
      elems => this.elems = elems, 
      error => this.errorMessage = <any>error); 
    } 
} 

Answer 1

Nun, wie Sie sagten, es ist eine asynchrone Anfrage. Also, wenn Sie etwas, nachdem die Anforderung beendet hat machen wollen, würde ich vorschlagen, dass die Logik in die onCompleted Rückruf bewegt Lambda der subscribe Funktion wie so:

export class DetailElemComp { 
    this.myService.addElem(this.elem) 
     .subscribe(
     data => null, 
     error => this.errorMessage = <any>error, 
     () => this.zone.run(() => this.router.navigate(['ListComponent'])) 
    ); 
} 

-Code unterhalb dieser subscribe Anruf sonst vor den Callbacks laufen innerhalb der subscribe Methode tun.