Angular2 http get request with Observables and dynamic url params. How to?

Question

Having this angular2 service taken from official docs with Observable, trying to modify to can pass on fly to the base heroesUrl dynamic parameters like app/heroes/{{country}} and use it like

getHeroes(country) {}

import { Injectable }     from '@angular/core';
import { Http, Response } from '@angular/http';
import { Hero }           from './hero';
import { Observable }     from 'rxjs/Observable';
@Injectable()
export class HeroService {
  constructor (private http: Http) {}
  private heroesUrl = 'app/heroes';  // URL to web API
  getHeroes (): Observable<Hero[]> {
    return this.http.get(this.heroesUrl)
                    .map(this.extractData)
                    .catch(this.handleError);
  }
  private extractData(res: Response) {
    let body = res.json();
    return body.data || { };
  }
  private handleError (error: any) {
    // In a real world app, we might use a remote logging infrastructure
    // We'd also dig deeper into the error to get a better message
    let errMsg = (error.message) ? error.message :
      error.status ? `${error.status} - ${error.statusText}` : 'Server error';
    console.error(errMsg); // log to console instead
    return Observable.throw(errMsg);
  }
}

How would I do that?

micronyks · Accepted Answer · 2016-09-08 11:11:35Z

1

I think you just need to do following things if I understood your point,

getHeroes(country) {}


export class HeroService {
  constructor (private http: Http) {}
  private heroesUrl = 'app/heroes';  // URL to web API
  getHeroes (country): Observable<Hero[]> {               //<-----added parameter
    return this.http.get(this.heroesUrl + '/' + country)  //<-----changed
                    .map(this.extractData)
                    .catch(this.handleError);
  }
  ...
  ...
}

answered Sep 8, 2016 at 11:11

micronyks

55.6k17 gold badges122 silver badges166 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Angular2 http get request with Observables and dynamic url params. How to?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related