title: Custom ngx-translate loader, receiving cannot set property 'http' of undefined
body: <p>I'm setting up a Ionic 4 project using ngx-translate and a custom loader to load JSON translations from an external domain. I've been following this guys take on it: <a href="https://forum.ionicframework.com/t/ngx-translate-translatehttploader-with-external-url/99331/4" rel="nofollow noreferrer">https://forum.ionicframework.com/t/ngx-translate-translatehttploader-with-external-url/99331/4</a></p>
  
  <p>Stackblitz link: <a href="https://stackblitz.com/edit/ionic-v4-jdfbh6" rel="nofollow noreferrer">https://stackblitz.com/edit/ionic-v4-jdfbh6</a></p>
  
  <p>So this is my custom loader (provider).</p>
  
  <pre><code>@Injectable()
  export class TranslationProvider implements TranslateLoader {
    constructor(private http: HttpClient) {
      console.log('Hello TranslationProvider Provider');
    }
  
    getTranslation(lang: string): Observable&lt;any&gt; {
      return Observable.create(observer =&gt; {
        this.http.get&lt;any&gt;(Environment.base_api + '/static/translations/' + lang + 'json', {
        headers: {'Content-Type': 'application/json'}}).subscribe((res: Response) =&gt; {
          observer.next(res.json());
          observer.complete();
        });
      });
    }
  }
  </code></pre>
  
  <p>and in my app.module.ts (imports):</p>
  
  <pre><code>imports: [
    BrowserModule,
    IonicModule.forRoot(App),
    IonicStorageModule.forRoot(),
    HttpClientModule,
    TranslateModule.forRoot({
      loader: {
        provide: TranslateLoader,
        useFactory: (TranslationProvider),
        deps: [HttpClient]
      }
    })
  ],
  </code></pre>
  
  <p>The error message I receive is: </p>
  
  <p><code>TypeError: Cannot set property 'http' of undefined at TranslationProvider (http://localhost:8100/build/main.js:1073:19)</code></p>