I'm been reading the docs and I facing the same problem as @mailok.
The project where I'm planning to use transloco is an Nx monorepo where every app is practically empty.
All the code is in the libraries and libraries are shared across many apps.
What I need is to have the i18n .json files contained into each lib to avoid duplication.
There is an approach to deal with this use case yet?
Thanks again!
Ok, so apparently Stackblitz and CodeSandbox have some issues with Nx.
Anyway, this is the repo, I tried to keep it as simple as posible.
In master, it is using a custom loader and it is not working. I managed to make it work in branch dynamic-translations but I would prefer to use a loader.
Also, when loading a lib module eagerly, and the translation key is repeated in the app or another lib, it gets overwritten.
To run the app, just ng serve.
Hi @shaharkazaz
Is there anything preventing us to use transloco@2 and angular@8 with transloco-messageformat@1.1.1 ?
npm WARN @ngneat/transloco-messageformat@1.1.1 requires a peer of @angular/common@^7.2.0 but none is installed. You must install peer dependencies yourself.
npm WARN @ngneat/transloco-messageformat@1.1.1 requires a peer of @angular/core@^7.2.0 but none is installed. You must install peer dependencies yourself.
npm WARN @ngneat/transloco-messageformat@1.1.1 requires a peer of @ngneat/transloco@^1.6.0 but none is installed. You must install peer dependencies yourself.Or can we safely ignore these warnings?
Hi, i'm in the middle of hooking up the Transloco Optimize plugin, but the readme isn't perfect in explanation of using it as a function.
This:
const locales = `${config.paths.dist}${config.paths.assets.locales}`; could realistically point to a path of any structure.
Can anyone confirm that the path should look like this:
const pathToLocales = `${__dirname}/dist/${appName}/assets/i18n`;And if so, i'll make a PR to update this to be more specific
translocoOptimize function isn't a default export from the index.js, however, the docs in the README say to import it as though it was a default export. I'll submit a PR to fix the docs for that
So if i do this:
import translocoOptimize from '@ngneat/transloco-optimize';I get this error
ERROR! TypeError: transloco_optimize_1.default is not a functionand if i do this:
import { translocoOptimize } from '@ngneat/transloco-optimize';I get this error
ERROR! TypeError: transloco_optimize_1.translocoOptimize is not a functionTo fix this I had to use:
const translocoOptimize = require('@ngneat/transloco-optimize')require or i guess(?) const translocoOptimize = import('@ngneat/transloco-optimize')
@shaharkazaz I realize that using a unique scope for the eagerly loaded lib modules can solve the problem of the overwritten translations. This is using dynamic translations.
What remains that I would like you to help me in is achieving the use of loaders in libs. Encapsulating its translation files inside the lib.
Minor error in Transloco Documentation for MessageFormat: ngneat/transloco#132
It should be customFormatters instead of formatters.
I also noticed that if your customFormatter name begins with one of the default formatters [date, time, duration, etc...], it fails.
Example:
TranslocoMessageFormatModule.init({
customFormatters: {
time24: v => translateTime(v)
}
})It fails with the error message: "Expected "," or "}" but "2" found."
I accept the <a>policy</a> and the <a>terms of use</a>
Hello @shaharkazaz, how are you? I just tested the new release, everything is working smoothly. Thanks for the effort!
There is only one thing I wanted to ask you. Do you know, why I can't use kebab-case as an alias for my libs scope?
You can try it in the last commit of my master branch in the same repo as before.
https://github.com/NachoVazquez/transloco-with-nx-libs
Use lib-a instead of libA in the configuration of the TranslocoLibAModule.
I can live without it, but I just wanted to ask.
Thanks again for everything!
Here is a demo of the 2nd issue: https://stackblitz.com/edit/transloco-example-qo4qhw
I defined a customFormatter 'time24'
When you try to work directly with MessageFormat (creating a new class and passing the options not related to Transloco) time24 is valid?
I accept the <a>policy</a> and the <a>terms of use</a> via innerHTML binding and Angular will sanitize it for you if it's inside an html.This isn't related to Transloco.
Correct me if I missunderstood.
@shaharkazaz sorry for my lack of clarity. Our usage was <p>{{ t('policyAgreement') }}</p> where in our i18n json files we had:
{
"policyAgreement": "I accept the <a>policy</a> and the <a>terms of use</a>"
}If I understand you correctly, you are suggesting we do:<p [innerHtml]="t('policyAgreement')"></p>
@shaharkazaz Doing this has issues with Angular's sanitizer. It strips out the routerLink binding. However, i think this points to a bigger issue. Dynamically adding html to Angular loses any binding to angular directives as angular does not process this new html.
To counter this we could do:
<span>{{ t('firstPartReferral') }} <a routerLink="location">{{ t('referralText') }}</a> {{ t('joinWord') }} <a routerLink="terms">{{ t('terms') }}</a></span>However, this will fall over itself when we are trying to translate to languages that change word order.
I know this isn't a transloco issue, but any ideas?