Angular 2 / rxjs chaining HTTP calls

Question

I have a registration form. Step 1 user creates an account. As user creates an account I need to authenticate user with the created account.

in my account.service.ts I have following.

Is this the best way to handle this? and how can improve this to handle errors from 2 different http calls?

  public createAccount(reg: CreateUserRequestModel): Observable<any> {
    return this.apiService.post('api/register/account', reg)
      .flatMap(()=>{
        return this.authenticationService.authenticate(reg.emailAddress, reg.password)
      }).map((response)=>{
        return response.json()
      })
      .catch((error: any) => {
        return Observable.throw(error.json());
      });
  }

Answer 1

public createAccount(registrationRequest: CreateUserRequestModel): Observable<SomeType> {
  return this.apiService.post('api/register/account', registrationRequest)
    .flatMap(() => this.authenticationService.authenticate(registrationRequest.emailAddress, registrationRequest.password))
    .map(response => <SomeType>response.json())
    .catch(error => Observable.throw(error.json()));
}

• @Tushar made a good point on code compactness, which can be applied to all arrow functions in the code.
• TypeScript is about types. Try to not use any in return type definitions. Do define some return type and cast the result to it (see SomeType).
• I'm not sure if you really want to do .catch(error => Observable.throw(error.json())) where it happens now or move it to the consumers side (e.g. .subscribe(() => {...}, error => this.handle(error))
• reg is a bad name. Spell things out.