feature: easily register and bundle translation data with a lazy loaded module

[pweyrich]

Is your feature request related to a problem? Please describe. I wanted to start lazy loading translations along with lazy loaded modules. The advice at https://github.com/robisim74/angular-l10n#lazy-loading did not really fit my needs since firstly I would need to bundle the translation data in a separate chunk and secondly I would need to implement a translation loader that is able to fetch this chunk via http (and only for lazy loaded modules).

Describe alternatives you've considered My current solution is to simply register my translation data during construction of my lazy loaded module:

export function lazyLoadTranslations(translationService: L10nTranslationService, data: { [lang: string]: any }): void {
    Object.keys(data).forEach((lang: string) => translationService.addData(data[lang], lang));
}

const lazyTranslationData = { de: {...}, en: {...} };

@NgModule({...})
export class LazyModule {
    constructor(private l10nTranslationService: L10nTranslationService) {
        lazyLoadTranslations(l10nTranslationService, lazyTranslationData);
    }
}

Describe the solution you'd like My solution actually works well and my translation data is being bundled with my lazy loaded module. But since the translation data by default need to be provided as typescript files now and lazy loading modules is a common practice in angular applications, I just not want to not need any custom logic to achieve this.

My proposal would be to re-introduce a forChild() method to the L10nTranslationModule which will take care of adding the translation data on demand. Example:

export const lazyTranslationData = { de: {...}, en: {...} };

@NgModule({
    imports: [L10nTranslationModule.forChild(lazyTranslationData)],
    ...
})
export class LazyModule {}

[robisim74]

Hi @pweyrich,

got it, but the loading of translation data depends on L10nTranslationLoader, and your custom implementation of it.

It's true, the default loader (https://github.com/robisim74/angular-l10n/blob/master/projects/angular-l10n/src/lib/services/l10n-translation-loader.ts#L22-L28) use translation data as typescript files, but it is intended for basic scenarios, such as simple applications or tests.

The request for a lazy module is done via an http request, and I think that the translation files in that case should also make an http request, to keep the bundle lighter.

I leave this request open to other opinions.

[robisim74]

I looked at the possible alternatives: I intend to keep the services and tokens of this library singleton, and the forChild method should be used to inject the services, without implementing any other logic.

On the other hand, here it is sufficient to load the new assets in the lazy module:

export class LazyModule {
    constructor(private translation: L10nTranslationService) {
        this.translation.loadTranslation([{ name: 'lazy', asset: lazyTranslationData}]);
    }
}

[robisim74]

Closed due to inactivity