How to attach an http context to the requests sent by translation module in angular

Question

I'm using Angular 17 and I implemented an i18n library and i now need to add an HttpContext object to every requests sent by the translate module so my interceptor can determine that it does not have to consider this request.

My interceptor looks like this :

    export const authInterceptor: HttpInterceptorFn = (req, next) => {
        const authSvc = inject(AuthService);
        const router = inject(Router);
    
        if (req.context.get(IS_PUBLIC_API)) {
          return next(req);
        }
        ...

I want to attach the key "IS_PUBLIC_API" to every requests sent by the translation module as I do for some http requests :

  private readonly CONTEXT = {context: new HttpContext().set(IS_PUBLIC_API, true)};

  login(body: Login): Observable<LoginResponse> {
    return this.http.post<LoginResponse>(`${environment.apiUrl}/login`, body, this.CONTEXT);
  }

The config for the translation module is this :

  TranslateModule.forRoot({
        defaultLanguage: 'fr',
        loader: {
          provide: TranslateLoader,
          useFactory: (http: HttpClient) => new TranslateHttpLoader(http),
          deps: [HttpClient]
        },
      })

Answer 1

you can make custom translate loader that would add context

export class MyTranslateLoader implements TranslateLoader {
  private readonly CONTEXT = {context: new HttpContext().set(IS_PUBLIC_API, true)};
  constructor(private http: HttpClient, public prefix: string = "/assets/i18n/", public suffix: string = ".json") {}

  public getTranslation(lang: string): Observable<Object> {
    return this.http.get(`${this.prefix}${lang}${this.suffix}`, this.CONTEXT);
  }
}

 TranslateModule.forRoot({
        defaultLanguage: 'fr',
        loader: {
          provide: TranslateLoader,
          useFactory: (http: HttpClient) => new MyTranslateLoader(http),
          deps: [HttpClient]
        },
      })