title: How to loop through an observable in Angular 4
body: <p>I have an array of sections and I'm trying to get and display all the items under each sections. It seems like a pretty simple take. Here is my code:</p>
  
  <pre><code>//my ngOnInit call this function 
  this.sectionService.GetItemList(this.selectedSectionList, this.culture)       
          .subscribe(
             (itemList: ItemBySection[]) =&gt; {
                 this.itemBySection = itemList;
  
                 this.loaded = true;
              },
              (error: any) =&gt; this.errorMessage = error, () =&gt; 
  console.log("loaded")
          );
  
  //this is my function in my service
   public GetItemList(SectionItems: Sections[], strCulture): Observable&lt;ItemBySection[]&gt; {
  
      let resultObservable
      for (var SectionItem in SectionItems) {
          let url = environment.portalWebServiceURL + "api/section/" + SectionItems[SectionItem].sectionItemID.toString() + "/" + strCulture;
          resultObservable = this.http.get(url)
              .catch(this.handleError)
              .mergeMap(res =&gt; &lt;ItemBySection[]&gt;res.json());
      }
  
      return resultObservable; 
  
  }
  </code></pre>
  
  <p>Maybe my explanation above wasn't too clear 
  So what I'm trying to do is call my web service multiple time within a loop and concatenate the result into one list. Maybe this will help.</p>
  
  <pre><code>for all my sectionIDs {
    call url web service with sectionID 
    receive results from server
    add the results in my item array
  }
  finally display all items.
  </code></pre>
  
  <p>I hope this help.</p>