Is it possible to use angular-l10n to support custom translations in library1 while the config for translations stays in the main app that uses library1?

[dmdum]

Hello, I'm trying to create a library that supports custom translations. The end goal is for the library to be published, installed in another project where I can pass some config to be used by angular-l10n in the library (used in table labels, buttons, etc).

The trigger for changing the language can either come from the app or some other component from the library that the developer uses.

I'm constrained to using version 8.1.1 of angular-l10n for now (unless there are no breaking changes in higher versions and it's still compatible with 8.1.1, then maybe I can update).

Is it possible to use this library in this context? Do you have suggestions on how I would go about doing that? (I'd like to apologize as I'm still a beginner at Angular so I'm not all that familiar with how this translation support in libraries is usually done)

Thank you!

[robisim74]

Hi,

you just need to import TranslationModule in the module of your library (without forRoot), then install the library in your app (there are different ways of doing this) and configure angular-l10n in your app: TranslationModule.forRoot(l10nConfig)

Note that angular-l10n v8 is for Angular v8: here the list of versions: https://github.com/robisim74/angular-l10n/blob/master/versions.md

Greetings

[dmdum]

Thank you! I'm currently on vacation so I can't test this out immediately. Would it be alright to keep this support request open until I get back around next week?

[dmdum]

@robisim74 Looking at our code base, we're actually using LocalizationModule.forRoot(l10nConfig) for our custom translations. Should it also be used the same way as TranslationModule.forRoot(l10nConfig)?

[robisim74]

@dmdum It's the same, it depends on the scenario. Please see the docs for v8: https://github.com/robisim74/angular-l10n/blob/angular_v8/docs/quick-start.md

[dmdum]

@robisim74 I tried implementing your suggestion, but I'm getting a NullInjectorError: NullInjectorError: No provider for InjectorRef! when I try importing LocalizationModule on the library without a .forRoot (I tried using and importing TranslationModule as well, I get the same error).

I've read the docs for v8 and the translation works on the main app with the config, but I can't seem to find a way to pass on the translations to the library as well (ideally using directives, if that's even possible?)

Edit: I guess I should note that I haven't published the library yet. I am adding the build path in the app's tsconfig.json. The library and the app are in a different workspace (I read somewhere that an issue is encountered when the library and the app are on a different workspace, but I've tested it where they're in the same workspace and I still get that error). The components in my library are standalones.

[robisim74]

The components in my library are standalones

You said you are using the v8 version of this library, but the standalone components were introduced with angular v14, if I'm not wrong

[dmdum]

@robisim74 yes, it'a bit complicated but the versions of packages in the app i use here is based on the versions of another app. I know now that I should use v14 of your library, yes?

Do you think the error is because of the version mismatch? How would you recommend I approach the goal above with v14?

[robisim74]

There are a lot of things to take into consideration:

• This library supports standalone components officially from v15: https://github.com/robisim74/angular-l10n/releases/tag/v15.0.0. With previous versions it should work by importing the LocalizationModule into the component (but it is not optimal): https://github.com/robisim74/angular-l10n/releases/tag/v14.0.0
• The v8 version of this library is for angular v8: and from the later version it has been completely rewritten: https://github.com/robisim74/angular-l10n/blob/angular_v9/MIGRATION_GUIDE.md
• From Angular v9, Angular uses the new Ivy's view engine
• Also nodejs versions are different: https://angular.io/guide/versions

Furthermore, you should also see which tool you are building your library with: ng-packagr or something else? Ivy compatibility?

I understand that keeping libraries updated is difficult: but perhaps in your case it is necessary. But before you update everything: I suggest you create a small test library with aligned versions and see if it works.

I can't help you more than that: I would need a small repo that recreates the situation.

[dmdum]

Is it alright to use v15 of the library with v14 angular?

I can't seem to import LocalizationModule in v14.

Sorry I'm not very good at explaining this yet. I'm not entirely sure if what I'm imagining it should look like is possible to be honest. I'll try to recreate it and post the repo here maybe in a few days.

Thanks so much for all your help so far!

[dmdum]

Hi, it seems like I won't have time to replicate this on a smaller scale. I'll be closing this for now. Thanks for all your help!