t2ym
commented
5 years ago Hi @chisholmd,
The localizable element follows the lang attribute of the <html> tag, which is set as navigator.language by i18n-preference element automatically inserted by i18n-behavior. i18n-element is a wrapper for i18n-behavior.
In addition to the automatic setting of the language described above, you can manually set the language of the element in DevTool console by one of these methods as well.
document.querySelector('html').lang = 'fr'; // set lang attribute/property of <html> elementdocument.getElementById('el1').lang = 'fr'; // set lang attribute/property of <localizable-element>
By default, <localizable-element> automatically mirrors the lang attribute of the <html> element.
Whenever the lang attribute is updated, locales/localizable-element.{lang}.json is loaded and reflected to the target element(s).
For more information, please see i18n-behavior.
Are you clear on the behavior now?
I don't like to think of myself as a stupid person, but I am having a very hard time following your examples. Install and then Import:
Then I see an example of adding an element like this:
Then I see some example contents of a localizable element like this:
Localizable UI label 2
Localizable UI label 3
So how does one relate to the other? where does the "el1" id you set as an example when you call that element get used? I can imagine changing those labels to en, fr, etc. is that what I do? set the id of the element to the lang I am using?
I am going to dig through your demo's but your demo's try to cover so much in one demo its hard to sort out what is going on.
I really appreciate you developing this component and making it available, it would be really nice to be able to understand and use it.