L20n.js:本地化动态创建的字符串
L20n.js: localize dynamically created strings
在我的应用程序中,我可以通过标签本地化大部分字符串,如 l20n.js 文档中所述。但有时我必须本地化动态创建的字符串。喜欢:document.getElementById(id).innerHTML = "some text";
我使用 Polymer 和自定义 Web 组件,因此主要目标是为任何本地化案例创建一个函数。
如果我尝试 document.l10n.get(string);
,我会得到 TypeError: document.l10n.get is not a function
。
最好的方法是什么?在官方文档中找不到解决方案。
由于 document.l10n
是 L20n View
class 的一个实例,您可以将 formatValue
和 formatValues
方法用于您的用例。详情请见documentation。
两种方法 return 都承诺,因此您需要执行以下操作:
document.l10n.formatValue('hello', { who: 'world' }).then(
hello => document.getElementById(id).textContent = hello
);
您可以分配给 textContent
或 innerHTML
。请记住,L20n 允许在翻译中使用 HTML,并且仅在使用声明性 data-l10n-id
方法时才对它们进行清理。因此,如果您想手动分配给 innerHTML
,您可能需要确保您信任翻译的内容。将来我想添加一个特殊的 API 来将翻译应用到 DOM 元素,使用与声明方法相同的清理(bug 1228021)。
在我的应用程序中,我可以通过标签本地化大部分字符串,如 l20n.js 文档中所述。但有时我必须本地化动态创建的字符串。喜欢:document.getElementById(id).innerHTML = "some text";
我使用 Polymer 和自定义 Web 组件,因此主要目标是为任何本地化案例创建一个函数。
如果我尝试 document.l10n.get(string);
,我会得到 TypeError: document.l10n.get is not a function
。
最好的方法是什么?在官方文档中找不到解决方案。
由于 document.l10n
是 L20n View
class 的一个实例,您可以将 formatValue
和 formatValues
方法用于您的用例。详情请见documentation。
两种方法 return 都承诺,因此您需要执行以下操作:
document.l10n.formatValue('hello', { who: 'world' }).then(
hello => document.getElementById(id).textContent = hello
);
您可以分配给 textContent
或 innerHTML
。请记住,L20n 允许在翻译中使用 HTML,并且仅在使用声明性 data-l10n-id
方法时才对它们进行清理。因此,如果您想手动分配给 innerHTML
,您可能需要确保您信任翻译的内容。将来我想添加一个特殊的 API 来将翻译应用到 DOM 元素,使用与声明方法相同的清理(bug 1228021)。