You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Now you need to install the npm module for MultiTranslateHttpLoader:
npm install ngx-translate-multi-http-loader
Choose the version corresponding to your Angular version:
Angular
@ngx-translate/core
ngx-translate-multi-http-loader
>= 16
15.x+
>= 15.x+
15
14.x+
9.x+
14
14.x+
8.x+
13
14.x+
7.x+
6
10.x+
1.x+
Usage
The MultiTranslateHttpLoader uses HttpBackend to load translations, therefore :
Create and export a new HttpLoaderFactory function
Import the HttpClientModule from @angular/common/http
Setup the TranslateModule to use the MultiTranslateHttpLoader
import{NgModule}from'@angular/core';import{BrowserModule}from'@angular/platform-browser';import{HttpClientModule,HttpBackend}from'@angular/common/http';import{TranslateModule,TranslateLoader}from'@ngx-translate/core';import{MultiTranslateHttpLoader}from'ngx-translate-multi-http-loader';import{AppComponent}from'./app';// AoT requires an exported function for factoriesexportfunctionHttpLoaderFactory(_httpBackend: HttpBackend){returnnewMultiTranslateHttpLoader(_httpBackend,['/assets/i18n/core/','/assets/i18n/vendors/']);// /i18n/core/ on angular >= v18 with the new public logic}
@NgModule({imports: [BrowserModule,HttpClientModule,TranslateModule.forRoot({loader: {provide: TranslateLoader,useFactory: HttpLoaderFactory,deps: [HttpBackend]}})],bootstrap: [AppComponent]})exportclassAppModule{}
The MultiTranslateHttpLoader takes a list of (string | TranslationResource)[].
String[]
For example ['/assets/i18n/core/', '/assets/i18n/vendors/'],
will load your translations files for the lang "en" from : /assets/i18n/core/en.json and /assets/i18n/vendors/en.json
Custom suffix
For now this loader only support the json format.
Instead of an array of string[],
you may pass a list of parameters:
prefix: string = '/assets/i18n/'
suffix: string = '.json'
optional: boolean = true
exportfunctionHttpLoaderFactory(_httpBackend: HttpBackend){returnnewMultiTranslateHttpLoader(_httpBackend,[{prefix: './assets/i18n/core/',suffix: '.json'},{prefix: './assets/i18n/vendors/'},// , "suffix: '.json'" being the default value{prefix: './assets/i18n/non-existent/',optional: true},// Wont create any log]);}
The loader will merge all translation files from the server
Possible error & Bugfix
values.at is not a function
Install core-js
In polyfills.ts, add import 'core-js/modules/es.array.at'