Calling functions before subscribing

I have a http call to a remote server using the angular2/http and thats all working awesomely and such. But I’m having trouble with using the observables that it returns.

When I do my http calls, I’m going through 3 different components.

(for ease here ill just make the calls 3 different methods instead as it works out the same)

What I want to know if its possible to do, is use subscribe twice on the same observable or if there is a way that I can call some functions so I can add logging in the request rather than needing to add it at every location that I make a http call.

  request(type: RequestMethod, url: string, data: any) {

    let params: URLSearchParams = new URLSearchParams();
    let req: RequestOptions;
    let headers = new Headers();

    for (let key in data) {
      params.set(key, data[key]);
    }

    if (type === 0) {
      req = new RequestOptions({
        method: type,
        search: params
      });
    } else {
      headers.append('Content-Type', 'application/x-www-form-urlencoded');
      req = new RequestOptions({
        method: type,
        body: params.toString(),
        headers: headers
      });
    }

    console.log('Http Request: ' + url);
    console.log(req);
    return this.http.request(this.testUrl + url, req)
      .map((res: Response) => res.json());
      // .subscribe(                                  
      //   data => {                                 
      //     console.log('Data Return for ' + url); 
      //     console.log(data.data);
      //     // return data;  //i removed this subscribe so i can 
      //   },                //pass the map back through and
      //   err => {          //use the subscribe later in the initial call
      //     this.logError(url, err);
      //   },
      //   () => {
      //     if (afterSuccess) {
      //       afterSuccess();
      //     }
      //     console.log('Completed '+ url);
      //   }
      // );
  }

  logError(url: string, err: any) {
    console.log('Error in call: ' + url);
    console.log(err);
  }

  get(url: string, data: any) {
    return this.request(RequestMethod.Get, url, data);
  }

  post(url: string, data: any) {
    return this.request(RequestMethod.Post, url, data);
  }

  emailExists(email_address: string, user_type?: string) {
    let data: any = {};

    data.email_address = email_address;
    data.service_provider_id = this.service_provider_id;

    if (user_type) {
      data.user_type = user_type;
    }

    return this.get('emails/email-address/exists', data);
  }

  ngOnInit() {
    this.emailExists('an.email@gmail.com').subscribe(data => {
      this.email = data.data;
      console.log('in Signin');
      console.log(this.email);
    }, err => {
      console.log(err);
    }, () => {

    });
  }

In the request method I want to be able to call a console.log to print out the url that was used and print the data received from the server or any errors.
I know I could add it to the success and error portions of the subscribe in the emailExists() call in ngOnInit() but that would mean I would need to put those in every single call throughout the app.

Thanks in advance for your help and time.

1
Leave a Reply

avatar
1 Comment threads
0 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
1 Comment authors
Jason Recent comment authors
  Subscribe  
newest oldest most voted
Notify of
Jason
Guest

You could leverage the do, catch and finally operators of observables to do that. Here is a sample: return this.http.request(this.tpayUrl + url, req) .map((res: Response) => res.json()) .do(data => { console.log('Data Return for ' + url); console.log(data.data); }) .catch(err => { this.logError(url, err); return Observable.throw(err); }) .finally(() => { if (afterSuccess) { afterSuccess(); } console.log('Completed '+ url); });