core
core copied to clipboard
lang attribute in html element
[ ] bug report => check the FAQ and search github for a similar issue or PR before submitting
[ ] support request => check the FAQ and search github for a similar issue before submitting
[X] feature request
Current behavior The html element in the DOM don't has the lang attribute.
Expected/desired behavior
Having the lang attribute in html element.
The DOM must look like:
<html lang="en">
What is the motivation / use case for changing the behavior? Be more standard on language identification for SEO or other tools.
-
ngx-translate version: 6.0.1
-
Angular version: 4.0.1
-
Browser: [all]
As wokaround it's possible to subscribe to onLangChange in the app.component and modify the DOM via ElementRef.
My code:
import { Component, ElementRef, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core';
import { Subscription } from 'rxjs/Subscription';
import { TranslateService } from '@ngx-translate/core';
@Component({
selector: 'gp-app-root',
encapsulation: ViewEncapsulation.None,
templateUrl: './app.component.html',
styleUrls: ['./app.component.scss']
})
export class AppComponent implements OnInit, OnDestroy {
/**
* The onLangChange subscription to update the component if the language change.
* @type {any}
*/
onLangChange: Subscription = undefined;
/**
* The constructor.
*
* @param el the current element reference
* @param translate the translate service
*/
constructor(public el: ElementRef, public translate: TranslateService) { }
ngOnInit() {
this.updateLanguage();
this.onLangChange = this.translate.onLangChange.subscribe(() => {
this.updateLanguage();
});
}
ngOnDestroy() {
if (this.onLangChange !== undefined) {
this.onLangChange.unsubscribe();
}
}
/**
* Update the language in the lang attribute of the html element.
*/
updateLanguage(): void {
const lang = document.createAttribute('lang');
lang.value = this.translate.currentLang;
this.el.nativeElement.parentElement.parentElement.attributes.setNamedItem(lang);
}
}
Maybe can be done as a new parameter to the module (what do you think about reflectInHtml)
Sorry for not answering the issue for such a long time. We try to do better in the future, promised.
I see the point in your feature request and and easy solution already exists.
We can add the feature if more people ask for it.
Some news here?
Thanks @ocombe
+1
+1
+1
+1
+1
+1
+1
+1
+1
+1
+1
+1
+1
Hey congratulations with your "+1" spam, you made me lock this thread
Will be automatically updated with the following PR : https://github.com/ngx-translate/core/pull/1574