Here is the structure of my modules:
https://i.sstatic.net/zO9dE.png
The HTTP interceptor I provided in core.module.ts is affecting the HTTP client in the translation.module.ts. This is how my core module is set up:
@NgModule({
declarations: [DefaultLayoutComponent],
providers: [
{ provide: BASE_API_URL, useValue: environment.api },
{ provide: HTTP_INTERCEPTORS, useClass: BaseUrlInterceptor, multi: true }
],
imports: [BrowserModule, BrowserAnimationsModule, RouterModule, HttpClientModule],
exports: [DefaultLayoutComponent]
})
export class CoreModule {}
And this is the code for my translation module:
@Injectable({ providedIn: 'root' })
export class TranslationLoader implements TranslocoLoader {
constructor(private http: HttpClient) {}
getTranslation(lang: string) {
return this.http.get<Translation>(`/assets/i18n/${lang}.json`);
}
}
@NgModule({
declarations: [],
imports: [HttpClientModule, TranslocoModule],
providers: [
{
provide: TRANSLOCO_CONFIG,
useValue: translocoConfig({
availableLangs: ['en-US', 'de-CH', 'fr-CH', 'it-CH'],
defaultLang: 'en-US',
reRenderOnLangChange: true,
prodMode: environment.production
})
},
{ provide: TRANSLOCO_LOADER, useClass: TranslationLoader }
]
})
export class TranslationModule {}
Both modules are included in my app module:
@NgModule({
declarations: [AppComponent],
imports: [AppRoutingModule, CoreModule, TranslationModule],
bootstrap: [AppComponent]
})
export class AppModule {}
The issue arises when the translation module tries to load JSON files with incorrect URLs due to the interference of the BaseUrl interceptor. If anyone has a solution to this problem, please share your thoughts.
I am looking for a solution that does not involve conditionally applying the base URL within the interceptor or checking for specific headers.