diff --git a/packages/common/dbp-common-demo.js b/packages/common/dbp-common-demo.js index 9448fb39dcdb7b073a64bdee94d73aa83c6e45a5..dd88c98bbab43448334dbd00bc5a7fe832b363bd 100644 --- a/packages/common/dbp-common-demo.js +++ b/packages/common/dbp-common-demo.js @@ -304,6 +304,7 @@ html { <div class="control" id="dbp-translation-demo"> <dbp-translation key="toolkit-showcase" subscribe="lang, lang-dir"></dbp-translation> <dbp-translation key="toolkit-showcase-link" var='{"link1": "https://www.i18next.com/translation-function/interpolation"}' subscribe="lang, lang-dir" unsafe></dbp-translation> + <dbp-translation key="abc" subscribe="lang, lang-dir"></dbp-translation> </div> </div> </section> diff --git a/packages/common/src/translation.js b/packages/common/src/translation.js index 53895066643df1619d1a597ac93f23df6eb93eac..fc0e44046bc254a9674a27918c00a528321fb2d5 100644 --- a/packages/common/src/translation.js +++ b/packages/common/src/translation.js @@ -10,6 +10,7 @@ export class Translation extends DBPLitElement { this.lang = ''; this.interpolation = ''; this.langDir = ''; + this.unsafe = false; } static get properties() { @@ -44,7 +45,7 @@ export class Translation extends DBPLitElement { // create i18n instance with given translations this._i18n = createInstanceGivenResources(en, de); - // after init of overrides rerender page + // after init of overrides re-render page let local = this; if (this.langDir) { setOverridesByFile(this._i18n, this, this.langDir).then(function(response) { @@ -77,8 +78,17 @@ export class Translation extends DBPLitElement { return this._i18n.t(this.key); })(); + // if translation == "", key was not found + let key = ""; + if (translation != "") { + key = unsafeHTML("<!-- key: " + this.key + "-->"); + } else { + key = unsafeHTML("<!-- key: " + this.key + " not found! -->"); + } + // load translation text return html` + ${key} ${translation} `; }