I'm just starting i18next and I'd like to create translation file for each module in my project. It seems like using namespaces would be the right way to do this. The project can create a page layout using multiple views, so I need to be able to translate strings from multiple namespaces simultaneously.
I've create a simple example that has two namespaces, but I can only get i18next to translate strings for one namespace. If I use defaultNs: namespaces[0] then the numbers get translated, with defaultNs: namespaces[1] the colors are translated, and with defaultNs: namespaces nothing is translated. But I cannot figure out how to get both namespaces to translate.
<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="i18next.js"></script>
<script>
$(document).ready(function(){
var language = "en";
var namespaces = [ "numbers", "colors" ];
var config = {
lng: language,
fallbackLng: "en",
resGetPath: "namespaces/__ns__/__ns__-__lng__.json",
ns: {
namespaces: namespaces,
defaultNs: namespaces[0]
},
debug: true
};
i18n.init( config, function onInitComplete() {
$(".xl8").i18n();
});
});
</script>
</head>
<body>
<h1>hello, i18n!</h1>
<ol>
<li class="xl8" data-i18n="numbers.one">1</li>
<li class="xl8" data-i18n="numbers.two">2</li>
<li class="xl8" data-i18n="numbers.three">3</li>
</ol>
<ul>
<li class="xl8" data-i18n="colors.red">r</li>
<li class="xl8" data-i18n="colors.green">g</li>
<li class="xl8" data-i18n="colors.blue">b</li>
</ul>
</body>
</html>
I posted this same question on github and received the following working answer from jamuhl: