10.3.0, Angular
I wonder if there is an easy way to change the lang-attribute of the html-tag according to the currently selected language!?
Here is why: Most if not all of our users speak german and therefor our application's default language is german. There is no problem with that. Some of our users do not speak english and therefor have their browser (Google Chrome) set to translate english to german automatically. And this is where issues arise.
Since the application's lang-attribute is set to 'en' (<html lang="en">) the browser (Google Chrome) will try to translate the content to german. Since all of the content is in german already most of it can't be translated and will stay as it is. Some words in german are similar to words in english (missing just one letter and so on) but have a different meaning. The browser (Google Chrome) will now accept these words as english with spelling mistake and translates them to german. Which leads to more ore less funny results.
E.g. the german word "offen" (open) will be translated to "beleidigen" (to offend) since the browser thinks "offen" is "offend" with the last letter missing.
I think if we could set the lang-attribute of the html-tag to the currently selected language the issue would be resolved.
I tried to change the attribute's value via develper tools without success. But maybe testing like that is just not a valid approach.
4 Answer(s)
-
0
Hi @alexanderpilhar
I think you can change it as shown below;
window.document.documentElement.lang = "de" -
0
Hi @ismcagdas and thank your for your response!
It seems like it doesn't work when it wasn't already set on page load.
If I change the value from
"en"to"de"inindex.htmlall is fine. If I change the value inroot.component.ts(usingLocalizationService.currentLanguage.name) Google Chrome just ignores it.Any other ideas how to solve this?
-
0
Hi,
Could you try this in app.component.ts's ngOnInit ?
ngOnInit() { this.document.documentElement.lang = 'de'; } -
0
Sadly, this also doesn't work.
But I just found a solution :)
I removed the value from the
html-tag'slang-attribute inindex.html:<html lang="" dir="ltr">Then in
root.component.ts'ngOnInit()I set the attribute's value to the current language:ngOnInit(): void { document.documentElement.lang = this.localizationService.currentLanguage.name; }This seems to resolve the problem for me so far.
