title: Map firebase response to class
body: <p>I have the following class: </p>
  
  <pre><code>import { Hobbies } from './hobbies';
  
  export class Results {
  
  constructor(
      $key: string,
      first_name: string,
      gender: string,
      intent: string,
      seeking: string,
      training: string,
      latitude: string,
      longitude: string,
      location_desc: string,
      state: string,
      hobbies: Hobbies[],
      cloud_Id: string) {
  
  }
  
  static fromJsonList(array): Results[] {
      return array.map(json =&gt; Results.fromJson(json))
  }
  
  static fromJson({ $key, cloud_Id, first_name, gender, hobbies, intent, latitude, location_desc, longitude, seeking, state, training }): Results {
  
      debugger;
      return new Results(
          $key,
          first_name,
          gender,
          intent,
          seeking,
          training,
          latitude,
          longitude,
          location_desc,
          state,
          hobbies,
          cloud_Id);
  }
  
  
  }
  </code></pre>
  
  <p>I make a call to <code>Firebase</code> and retrieve a list of users who state matches the location I pass in as shown here:</p>
  
  <pre><code>getSearchResults(location: string): Observable&lt;Results[]&gt; {
  
          return this.af.database.list('/user/', {
              query: {
                  orderByChild: 'state',
                  equalTo: location
              }
          }).map(Results.fromJsonList);
  }
  </code></pre>
  
  <p>I then <code>.map</code> the response to <code>(Results.fromJsonList);</code></p>
  
  <p>Inside the <code>static</code> method <code>fromJson</code>, when I hit the <code>debugger</code> breakpoint and check the values being passed, they're all correct. </p>
  
  <p>However when I log the results within my component: </p>
  
  <pre><code>getSearchResultsComponent(gender: string, seeking: string, intent: string, location: string, hobbies?: string) {
  
    this.searchSubscription = this.searchService.getSearchResults(location).subscribe(results =&gt; {
     console.log(results);
    });
  
  }
  </code></pre>
  
  <p>I see the following:</p>
  
  <p><a href="https://i.stack.imgur.com/1R41E.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/1R41E.png" alt="enter image description here"></a></p>
  
  <p>Whereas I should be seeing the entries for two users, i.e first_name, gender, location etc.</p>
  
  <p>Can someone explain to why this mapping isn't working the way I envisioned it working?</p>