title: RxJS Refactor nested map statement
body: <p>I have a service which uses <code>@angular/http</code> to load data from an API.
  I want to create a projection of the retrieved data for my <code>Components</code> using this data.</p>
  
  <p>Therefore I wrote the following code:</p>
  
  <pre><code>getById(id: string) {
    return this.http
      .get(`https://my-api.io/${id}`)
      .map(response =&gt; response.json())
      .map(contracts =&gt;
        contracts.map(contract =&gt;        # &lt;- Nested map
          new Contract(
            contract['id'],
            contract['description']
          )
        )
      );
  }
  </code></pre>
  
  <p>In the <strong>6th</strong> line I have a nested <code>map</code>-Statement reducing the readability of my code.</p>
  
  <p><strong>Question</strong></p>
  
  <p>Can I do better? Is there an operator in RxJS which I can use instead of creating this kind of nesting?</p>
  
  <p>Thanks in advance!</p>