Feature(scope): Dynamically load and apply translations in app.routes
mackelito opened this issue · comments
Is there an existing issue for this?
- I have searched the existing issues
Which Transloco package(s) will this feature affect?
Transloco, Scoped Libs, Don't know / other
Is your feature request related to a problem? Please describe
We have a nx workspace and each feature library has translation files.. but I need to be able to override some of the features translations based on app.
Describe the solution you'd like
In the app routes I would like to use a custom loader that fetches the translations from a api and applies them when the feature is loaded.
Perhaps something like this...
export const loader = () => {
const translations = inject(TranslocoService).getTranslation();
return translations;
};
{
path: 'admin',
canActivate: [redirectGuard],
loadChildren: () => import('@myOrg/admin').then((m) => m.adminRoutes),
providers: [
provideTranslocoScope({
scope: 'admin',
loader: loader,
}),
],
},
but no matter how I try I end up with this:
Type '() => InlineLoader' is not assignable to type 'InlineLoader'. Index signature for type 'string' is missing in type '() => InlineLoader'.
Describe alternatives you've considered
ngx-translate, angular native i18n
Additional context
No response
I would like to make a pull request for this feature
Yes 🚀
@mackelito you may have missed a part of the type of your loader function. The inline loader's type is actually an alias for another type, HashMap<() => Promise<Translation>>
. Your error is telling you that the index part of the Hash<T>
type is missing, so your loader function should return either HashMap<() => Promise<Translation>>
or its alias, InlineLoader
.