CODEWITHSUNDEEP
javascriptangulartypescript
DarkW1nter
DarkW1nter

Reputation: 2851

Angular 6 - how to await the subscribe on a call

In the code below I have 2 calls, getDetail and Save. Save uses an object 'this.detail$' which is created in the subscribe of the 1st call, getDetail.

The trouble is this.detail$ is never assigned to before Save gets called. I've tried to put the Save logic in a function within the subscribe after this.detail$ is assigned to bit I get the same result. What's the best way to handle this?

SetPublishedFlag(flag: boolean, _id:string){
    this.id = _id;
    this.getDetail();
    this.Save(flag);
  }

  getDetail(): void {
    this.data.getEventDetail(this.id).subscribe(data => this.detail$ = data as DetailModel);
  }

  Save(flag: boolean) {
    this.detail$.Published = flag;
    this.edit.editEvents(this.detail$, this.id);
  }
}

Upvotes: 5

Views: 4020

Answers (3)

Guerric P
Guerric P

Reputation: 31815

Try something like:

async SetPublishedFlag(flag: boolean, _id:string){
    this.id = _id;
    this.detail$ = await this.getDetail();
    this.Save(flag);
  }

  getDetail(): Promise<DetailModel> {
    return this.data.getEventDetail(this.id).toPromise();
  }

  Save(flag: boolean) {
    this.detail$.Published = flag;
    this.edit.editEvents(this.detail$, this.id);
  }
}

Upvotes: 3

Chrillewoodz
Chrillewoodz

Reputation: 28328

Perhaps not the best solution, but a solution:

SetPublishedFlag(flag: boolean, _id: string){
    this.id = _id;
    this.getDetail(flag);
  }

  getDetail(flag): void {
    this.data.getEventDetail(this.id).subscribe((data) => {
      this.detail$ = data as DetailModel;
      this.Save(flag);
    });
  }

  Save(flag: boolean) {
    this.detail$.Published = flag;
    this.edit.editEvents(this.detail$, this.id);
  }

Upvotes: 1

Amit Chigadani
Amit Chigadani

Reputation: 29715

You can map the data back to your caller function and then subscribe over there to call Save().

or alternatively you can call the method Save() from getDetail() also.

SetPublishedFlag(flag: boolean, _id:string){
    this.id = _id;
    this.getDetail().subscribe(() => { 
             this.Save(flag); // call save after observable has been returned
     });
  }

  getDetail(): void {
    return this.data.getEventDetail(this.id).pipe(map(data => this.detail$ = data as DetailModel));
  }

  Save(flag: boolean) {
    this.detail$.Published = flag;
    this.edit.editEvents(this.detail$, this.id);
  }
}

Upvotes: 1

Related Questions