angular2使用Observable（Http）无需重新加载

Question

I have a PartnersService that in constructor load list of partners array from server.

this.partners = this._http.get('/app/partners/partners.data.json')
            .map(this.extractData)
            .catch(this.handleError);

When I get a list of partners, everything OK. But I need to get partner by ID. In this case, I use function with callback

getPartner(id:number, callback:(partner:Partner)=>void):void {
    this.partners.subscribe(partners=> {
        for (let partner of partners) {
            if (partner.id == id) {
                callback(partner);
            }
        }
    });
}

In browser console, I see that any time when I call subscribe , angular2 send request to server. Can I do something, to not send request any time? And maybe exist better way to create getPartner() function(without callback)?

Answer 1

You could try something like that:

getPartners() {
  if (this.partners) {
    return Observable.of(this.partners);
  } else {
    return this._http.get('/app/partners/partners.data.json')
        .map(this.extractData)
        .catch(this.handleError)
        .do(partners => {
          this.partners = partners;
        });
  }
}

getPartner(id:number):Observable<partner> {
  this.getPartners().map(partners => {
    return partners.find(partner => (partner.id == id));
  });
}

And execute the method this way:

this.service.getPartner('some id').subscribe(partner => {
  console.log(partner);
});

Answer 2

You could use publishLast() as well to capture the event.

constructor() {
  this.partners = this._http.get('/app/partners/partners.data.json')
        .map(this.extractData)
        .catch(this.handleError)
        //shares the subscription with all observers so you don't get repeated
        //calls and caches the result.
        .publishLast();
  //Initiates the http call
  this.connection = this.partners.connect();
}

getPartner(id:number):Observable<partner> {

  return this.partners
             //Convert Observable<partner[]> to Observable<partner>
             .flatMap(x => x)
             .filter(p => p.id === id);
}