Broken translation when using setTranslation in dynamic component

[xeii]

I'm submitting a ... (check one with "x")

[x ] bug report => check the FAQ and search github for a similar issue or PR before submitting
[x ] support request => check the FAQ and search github for a similar issue before submitting
[ ] feature request

Current behavior
When defining translations in dynamically loaded component some of the translations do not work. In the provided stackblitz either en, fr or both translations are missing depending on how the .defaultLang and .use are called.

Expected/desired behavior
I want a dynamically loadable component that would define its own translations. Also, the language change event from main application should reach the dynamic component.

Reproduction of the problem
https://stackblitz.com/edit/github-1ujje5

• ngx-translate version: 10.0.0

• Angular version: 6.0.0-rc.0 / 5.2.x in my application

• Browser: [all]

[xeii]

Added related question in SO:

https://stackoverflow.com/questions/50015765/ngx-translate-settraslation-missing-translation-in-dynamic-component

[alexzuza]

It has nothing to do with dynamic component.

Seems you have to wait till json file is loaded. Otherwise your dynamic translations will be overrided.

this.translate.getTranslation('en').pipe(take(1)).subscribe(() => {
  this.translate.setTranslation('en', {
    'DYNAMIC': 'I am dynamic component'
  }, true);
});

https://stackblitz.com/edit/github-1ujje5-8bya2x?file=src/app/app.component.ts

[xeii]

@alexzuza Thank you! I never thought they would be overridden that way around.

[xeii]

I found another issue, this time I swapped fr to be the default and used language. Now the translation in dynamic component is not working. Strangely enough, if swap around (as in change the order) the code blocks where translations are set in dynamic component, they start working again. Seems like another race condition.

I updated the stackblitz: https://stackblitz.com/edit/github-1ujje5-sugj8h