Lovelace custom card internationalization

Development
1

I’d appreciate any help, references to examples for having internationalization of a custom Lovelace card.

What I tried so far:

  • created a translations/XX.json translation file in the custom card directory with strings to be translated.
  • defined a _label function in my-custom-card.js:
  _label(label, fallback = 'unknown') {
    const lang = this.myhass.selectedLanguage || this.myhass.language;
    const resources = this.myhass.resources[lang];
    return (resources && resources[label] ? resources[label] : fallback);
  }
  • the below line of code in the content update of the my-custom-card.js doesn’t work (in fact it always displays the English version even the browser is set to another language (in which case some elements are indeed displayed in the non-English language)):
"myLabel:" + `${this._label('ui.components.relative_time.future.In', 'in')}`

Thanks in advance.

2

Ever found the answer?

3

In the end I solved it in a different way:

1 Like