Hack The Library

The Loader

The loader provides you with the ability to override the default handling of translation file loading.

import { TranslocoLoader } from '@ngneat/transloco';
export class CustomLoader implements TranslocoLoader {  getTranslation(lang: string) {    if(langInLocalStorage) {      return of(langFromStorage);    }
    return ...  }}
export const customLoader = {  provide: TRANSLOCO_LOADER,  useClass: CustomLoader}

The Interceptor

The interceptor provides you with the ability to manipulate the translation object before it is saved by the service.

import { TranslocoInterceptor } from '@ngneat/transloco';
export class CustomInterceptor implements TranslocoInterceptor {  preSaveTranslation(translation: Translation, lang: string): Translation {    return translation;  }
  preSaveTranslationKey(key: string, value: string, lang: string): string {    return value;  }}
export const customInterceptor = {  provide: TRANSLOCO_INTERCEPTOR,  useClass: CustomInterceptor};

Missing Handler

This handler is responsible for handling missing keys. The default handler calls console.warn() with the key when config.isProdMode is set to false, and returns an empty string to use as a replacement for the missing key's value.

import { TranslocoMissingHandler } from '@ngneat/transloco';
export class CustomHandler implements TranslocoMissingHandler {  handle(key: string, config: TranslocoConfig) {    return '...';  }}
export const customMissingHandler = {  provide: TRANSLOCO_MISSING_HANDLER,  useClass: CustomHandler};

Fallback Strategy

The fallback strategy is responsible for loading the fallback translation file, when the selected active language has failed to load. The default behavior is to load the language set in the config.fallbackLang, and set it as the new active language.

When you need more control over this functionality, you can define your own strategy:

import { TranslocoFallbackStrategy } from '@ngneat/transloco';
export class CustomStrategy implements TranslocoFallbackStrategy {  getNextLangs(failedLang: string) {    return '...';  }}
export const customFallbackStrategy = {  provide: TRANSLOCO_FALLBACK_STRATEGY,  useClass: CustomStrategy};

The getNextLangs method is called with the failed language, and should return an array containing the next languages to load, in order of preference.