問題描述
我正在研究 i18next 本地化庫的可能性.
I am investigating what is possible with i18next localization library.
現在我有以下代碼(full Fiddle is here):
Right now I have the following code (full Fiddle is here):
HTML
<div data-i18n="title"></div>
<input placeholder="Hello" value="name">
<div class="holder"></div>
<button class="lang" data-lang="en">Eng</button>
<button class="lang" data-lang="ch">Chi</button>
JS
$(document).ready(function () {
i18n.init({
"lng": 'en',
"resStore": resources,
"fallbackLng" : 'en'
}, function (t) {
$(document).i18n();
});
$('.lang').click(function () {
var lang = $(this).attr('data-lang');
i18n.init({
lng: lang
}, function (t) {
$(document).i18n();
});
});
});
它翻譯所有 text 元素，但問題是我無法翻譯 custom attributes.例如，div 內的文本已翻譯，但我不明白如何翻譯自定義屬性，如 placeholder 和 value.
It translates all text elements, but the problem is that I can not translate custom attributes. For example text inside the div is translated, but I can not understand how can I translate custom attributes like placeholder and value.
另一個問題是我的翻譯方式.每當單擊按鈕 Chi, Eng 時，我都會初始化翻譯(但我不確定這是正確的方式).編輯 我想我找到了解決這個問題的方法(我需要使用 setLng):i18n.setLng(lang, function(t) { ... })
Another problem is with my way of translation. Whenever a button Chi, Eng is clicked, I am initializing the translation (but I am not sure this is a correct way). Edit I think I found how to solve this problem (I need to use setLng): i18n.setLng(lang, function(t) { ... })
推薦答案
直接問i18next creator這個問題后，收到了以下回復:我需要的只是將我的自定義屬性放在翻譯元素的前面.這是一個例子:
After asking i18next creator this question directly, I received the following reply: all I need is to put my custom attribute in front of the translation element. Here is an example:
<div data-i18n="[title]titleTransl"></div>
<input data-i18n="[placeholder]placeTransl" value="name">
如果需要多個屬性，請用 ; 分隔它們.
If multiple attributes are needed, separate them by a ;.
我從中學到了兩件事:
- 我必須閱讀更好的文檔.
- 118next 的創作者真的很有幫助(這是對他的感謝).
這篇關于使用 i18next(占位符，值)翻譯自定義屬性的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網！