Simple filter on array of RXJS Observable
<p>I am starting my project with Angular2 and the developers seem to recommend RXJS Observable instead of Promises.</p>

<p>I have achieved to retrieve a list of elements (epics) from the server.
But how can I filter the elments by using for example an id?</p>

<p>The following code is an extraction from my app and shows now the final working solution. Let's hope it helps someone.</p>

<pre><code>@Injectable()
export class EpicService {

  private url = CONFIG.SERVER + '/app/';  // URL to web API

  constructor(private http:Http) {}

  private extractData(res:Response) {
    let body = res.json();
    return body;
  }

  getEpics():Observable&lt;Epic[]&gt; {
    return this.http.get(this.url + "getEpics")
      .map(this.extractData)
      .catch(this.handleError);
  }

  getEpic(id:string): Observable&lt;Epic&gt; {
    return this.getEpics()
      .map(epics =&gt; epics.filter(epic =&gt; epic.id === id)[0]);
  }
}

export class EpicComponent {

  errorMessage:string;
  epics:Epic[];
  epic:Epic;

  constructor(
    private requirementService:EpicService) {
  }

  getEpics() {
    this.requirementService.getEpics()
      .subscribe(
        epics =&gt; this.epics = epics,
        error =&gt; this.errorMessage = &lt;any&gt;error);
  }

  // actually this should be eventually in another component
  getEpic(id:string) {
    this.requirementService.getEpic(id)
        .subscribe(
        epic =&gt; this.epic = epic,
        error =&gt; this.errorMessage = &lt;any&gt;error);
  }
}

export class Epic {
  id: string;
  name: string;
}
</code></pre>

<p>Thank you in advance for your help.</p>