Synchronizing different method calls and return response in RxJs

Question

I have one method to fetch Contact data from database.

this.getContact("contact");

After getting desired output, I want to put it in Json store with the help of method below:

this.local.saveRecord("contact", c);

After everything is done, I want to fetch the saved data from store with the help of method below:

this.local.getRecordList("contact")

These three operations should be executed in sequential manner to return to the caller. To achieve that I have tried with the code below:

public somemethod(): Observable<Contact[]> {
return this.getContact("contact")
  .delay(1000)
  .pipe(
    concatMap(con =>
      this.local.saveRecord<Contact[]>("contact", con).delay(1000)
    )
  )
  .pipe(
    concatMap(contacts =>
      this.local.getRecordList<Contact>("contact").pipe(
        map((contacts: any[]) => {
          // Processing of data
        })
      )
    )
  );
}

But the response I am getting is Null always. I am not much familiar with RxJs operators. We can even skip the second step and fetch data directly from database if needed. Shall I use different operators to solve the issue? Or shall I think it in different way? Help appreciated. Thanks in advance.

score 1 · Answer 1 · answered Sep 06 '18 at 14:16

Use the correct operators :

public somemethod(): Observable<Contact[]> {
return this.getContact("contact")
  .pipe(
    mergeMap(contact => this.local.saveRecord('contact', contact)),
    mergeMap(record => this.local.getRecordList('contact'))
  );
}

Now to process the data, simply call

this.someService.somemethod().subscribe(contacts => {
  console.log(contacts);
});

And you should have the reponse from this.local.getRecordList('contact'). And yes, the calls will be sequenced.

Synchronizing different method calls and return response in RxJs

1 Answers1