TranslateLoader API

The loader is responsible for providing translations to your application. It can deliver embedded translations or load them from a server.

API

export abstract class TranslateLoader {
  abstract getTranslation(lang: string): Observable<TranslationObject>;
}

The matching provider helper is provideTranslateLoader(). See Configuration → Provider helpers.

API Description

getTranslation() receives the language code and returns an Observable that resolves to a translation object:

{
  "app.hello": "Hello World!"
}

In most cases you do not need to write your own loader. The bundled @ngx-translate/http-loader covers HTTP-based JSON loading and ships built-in multi-resource support. See Configuration → HTTP Loader.

Third-party loaders are listed in the plugins section.

Retrying failed loads

The service’s retry option resubscribes to the Observable returned by getTranslation() after an error. It does not call getTranslation() again for each retry. Custom loaders must start a fresh load on each subscription; for Promise-based loaders, use defer(() => fetchTranslations(lang)) instead of wrapping an already-created Promise with from(). Both helpers are exported by RxJS. Errors must propagate to the service for retries to run.

Registering a Custom Loader

Pass the loader class (or a factory) to provideTranslateLoader(), then nest it inside provideTranslateService():

app.config.ts

import { provideTranslateService, provideTranslateLoader } from '@ngx-translate/core';

export const appConfig: ApplicationConfig = {
  providers: [
    provideTranslateService({
      loader: provideTranslateLoader(MyTranslateLoader),
    }),
  ],
};

For loaders that need runtime arguments or values from inject(), use the factory form:

provideTranslateService({
  loader: provideTranslateLoader(() => new MyLoader(inject(HttpClient), '/i18n')),
})

You can also pass a bare class directly (it is auto-wrapped), but doing so emits a bare-class auto-wrap warning.

How to Build a Custom Loader

For a step-by-step guide see Write & use your own loader.