From 880e3c9a47b5afae00aca08d7d9fba8c0664eb62 Mon Sep 17 00:00:00 2001
From: Ken Blum <ken.blum@outlook.com>
Date: Thu, 3 Sep 2020 10:58:31 +0200
Subject: [PATCH] docs(README): add section for avoiding side-effects with
HttpInterceptors
---
README.md | 36 ++++++++++++++++++++++++++++++++++++
1 file changed, 36 insertions(+)
diff --git a/README.md b/README.md
index 75b6aa08..6b42478f 100644
--- a/README.md
+++ b/README.md
@@ -207,6 +207,42 @@ export function createTranslateLoader(http: HttpClient) {
export class AppModule { }
```
+##### Avoiding side-effects with HttpInterceptors
+
+If you are using custom `HttpInterceptors` (e.g. provided by an authentication library), you should bypass all `HttpInterceptors` when loading translation files.
+
+This can be achieved using the `HttpBackend` class, as described [here](https://github.com/angular/angular/issues/20203#issuecomment-368680437).
+
+```ts
+import {NgModule} from '@angular/core';
+import {BrowserModule} from '@angular/platform-browser';
+import {HttpBackend, HttpClientModule, HttpClient} from '@angular/common/http';
+import {TranslateModule, TranslateLoader} from '@ngx-translate/core';
+import {TranslateHttpLoader} from '@ngx-translate/http-loader';
+import {AppComponent} from './app';
+
+// AoT requires an exported function for factories
+export function HttpLoaderFactory(httpBackend: HttpBackend) {
+ return new TranslateHttpLoader(new HttpClient(httpBackend));
+}
+
+@NgModule({
+ imports: [
+ BrowserModule,
+ HttpClientModule,
+ TranslateModule.forRoot({
+ loader: {
+ provide: TranslateLoader,
+ useFactory: HttpLoaderFactory,
+ deps: [HttpBackend]
+ }
+ })
+ ],
+ bootstrap: [AppComponent]
+})
+export class AppModule { }
+```
+
#### 2. Define the `default language` for the application
```ts