title: Injected HTTP client isn't defined during runtime
body: <p>I'm attempting to use Angular's <code>HttpClient</code> in a service, but during runtime I'm encountering the following error:</p>
  
  <pre><code>ERROR TypeError: "this.http is undefined"
  </code></pre>
  
  <p>I'm importing HttpClientModule in my <strong>app.module.ts</strong>:</p>
  
  <pre><code>    import { HttpClientModule } from '@angular/common/http';
      ...
  
      @NgModule({
        imports: [
            HttpClientModule
            ...
        ],
        declarations: [AppComponent],
        bootstrap: [AppComponent]
      })
  </code></pre>
  
  <p>...and importing HttpClient in my <strong>app.service.ts</strong>:</p>
  
  <pre><code>import { HttpClient } from '@angular/common/http';
  import DataSource from 'devextreme/data/data_source';
  ...
  @Injectable()
  export class Service {
      constructor(private http: HttpClient) {}
  
      getDataSource(): DataSource {
          return new DataSource({
              byKey: function (key) {
                  return this.http.get("https://localhost/foobar" + encodeURIComponent(key))
              }
          });
      }
  }
  </code></pre>
  
  <p>Does <code>this</code> refer to a different scope because it's in a new object? Do I need to pass <code>http</code> in somehow, or does dependency injection cover that?</p>