1

In some angular service, I need to call a PUT method named, I need to call another GET method once after it is completed. Then the results from GET method should be stored in a variable in the service itself.

The code which I have written has some issue with it. Because when I call the service from the component, isUpdateSuccess shown as undefined in the component.

Here, I do not need to pass the ‘application’ object to the component. I need to pass only the ApplicationStatusModel as an observable. But I need to save application object to a variable named myApplication as I mentioned above.

I read few articles and went through some Stackoverflow posts too. No luck yet.

Service

private myApplication: ApplicationHeader;

updateStudentAssessmentStatus(model: ApplicationStatusModel): Observable<boolean> {

const data = this.svcHttp.put<boolean>(`${this.routePrefix}/${model.studentID}/applicationAssessmentStatus`, model)
  .pipe(
    switchMap(() => this.getApplicationHeaderById(model.studentID)
      .pipe(map(application => {
        console.log(`Application from update status ${JSON.stringify(application)}`);
        this.myApplication = application;
      })))
  );
return data;

}

component (which calls 'updateStudentAssessmentStatus') 

this.svcApplication.updateStudentAssessmentStatus(statusModel).subscribe((isUpdateSuccess: boolean) => {
      //isUpdateSuccess is NULL here.
      if (!isUpdateSuccess) {

      } else {

      }
    });
marcolz
  • 2,880
  • 2
  • 23
  • 28
Tharuka Gunathilake
  • 11
  • 2

2 Answers2

1

map() is used to transform an event into something else. You're currently using it to transform an ApplicationHeader into undefined, since you don't return anything from the map callback.

To apply a side-effect, tap() is what you need.

And you don't need so much nesting either.

private myApplication: ApplicationHeader;

updateStudentAssessmentStatus(model: ApplicationStatusModel): Observable<ApplicationHeader> {

  return this.svcHttp.put<boolean>(`${this.routePrefix}/${model.studentID}/applicationAssessmentStatus`, model).pipe(
    switchMap(() => this.getApplicationHeaderById(model.studentID)),
    tap(application => {
      console.log(`Application from update status ${JSON.stringify(application)}`);
      this.myApplication = application;
    })
  );
}
JB Nizet
  • 678,734
  • 91
  • 1,224
  • 1,255
  • Thank you for your explanation and code. I am getting an error after applying it. However, I am trying to get rid of those errors myself. I will comment the errors below just for your information. :-) – Tharuka Gunathilake Aug 23 '19 at 05:51
  • ERROR in src/app/main/services/application.service.ts(1310,5): error TS2322: Type 'Observable' is not assignable to type 'Observable'. Type 'boolean | ApplicationHeader' is not assignable to type 'boolean'. Type 'ApplicationHeader' is not assignable to type 'boolean'. src/app/main/services/application.service.ts(1314,9): error TS2322: Type 'boolean | ApplicationHeader' is not assignable to type 'ApplicationHeader'. Type 'false' is not assignable to type 'ApplicationHeader'. – Tharuka Gunathilake Aug 23 '19 at 05:51
  • Sorry for the typo. The reurn type of updateStudentAssessmentStatus should be Observable, not Observable. And you know that the update and the following get are successful because there is no error being emitted by the returned observable. Not because it emits a boolean. – JB Nizet Aug 23 '19 at 05:54
0

You can use .pipe() upon your first http subscription.

return your-First-Http-Request().pipe(tap((res: your response) => {

        your-First-Http-Request()
    }
})
CodeMind
  • 616
  • 1
  • 7
  • 19