Translate Angular 8 application using i18n at runtime

Question

I am developing a web app and I need to add multi-language support. I went through the Angular documentation and I noticed that the translation was occurring at build time. I was curious if we can develop it in a way that the app translates into different a language at run-time. I did some research but I could not find a proper answer.

So my question is, can I add at dropdown language selector at the top in the menu and change the language during runtime?

Pelotas

Answer 1

The one and only:

http://www.ngx-translate.com/

Im using it in all of my projects.

I don't like the i18n of Angular it need for every language a separated compilation and can't change at runtime.

Demo: https://stackblitz.com/github/ngx-translate/example

Tremor

Does it have any performance issues? Anything should I take into consideration before diving into it? – Pelotas

I didn't found a way how to split the language files in multiple json files so i can load only the needed files via lazy loading. I have to load the full language file on startup and it could take some time to load it by bigger projects ... – Tremor

In Angular 9 its possibile to change the language on runtime but i didn't tried it yet because im using angular 7: blog.ninja-squad.com/2019/12/10/angular-localize – Tremor

@seryoga It's possible to change language at runtime but it's not possible without refreshing the browser. Useless. – Heintz

i posted an example where its possibile to change it without refreshing ... – Tremor