Multilingual in Meteor

Question

I am developing a multilingual application in Meteor.js I would like to know, in your opinion, the best way to do this; for example, here is wat, which I'm doing right now (pretty sure that this can be done better);

First, I save the elements in mongodb with properties listed in the root of the language:

{ en: { name: "english name", content: "english content" }, it: { name: "italian name", content: "italian content" }, //since images are the same for both, are not nested images: { mainImage: "dataURL", mainThumb: "dataURL" } } 

Then I publish the subscription using the current sessionLang variable:

 Meteor.publish("elementsCurrentLang", function(currentLang) { var projection = { images: 1 }; projection[currentLang] = 1; return Elements.find({}, projection); }); 

I subscribe along the route using Iron Router waitOn hook:

 Router.route('/eng/elements', { waitOn: function() { return Meteor.subscribe("municipalitiesCurrentLang", Session.get('currentLang')); }, action: function() { this.layout('ApplicationLayout'); this.render('elements'); } }); 

Now the first problem: I would like to reuse the same template for each language, but I can’t just add the {{name}} or {{content}} template, since the subscription returns the attributes nested under lang root, so it’s necessary make, for example, {{en.name}} for English or {{it.name}} for Italian; To avoid this, I use a template helper that creates a new object; essentially it removes attributes from the lang root:

 Template.elements.helpers({ elements: function() { var elements = Elements.find(); var currentLang = Session.get('currentLang'); var resultList = []; elements.forEach(function(element, index) { var element = { name: element[currentLang].name, content: element[currentLang].nameUrl, images: element.images }; resultList.push(element); }); return resultList; } }); 

And now in the template, I can access attributes like Wanted:

  <h1>{{name}}</h1> <p>{{content}}</p> 

Before continuing this approach, I want to listen to the suggestions, as I do not know if this will work well; when will Session.currentLang change, will the subscription restart? is there any way to avoid forEach loop in template helpers?

Answer 1

I am also developing a multilingual web application, and I advise you to use a package like this one: https://atmospherejs.com/tap/i18n

You can change langage reactively. Have the same template for all your languages ​​as you want! You can specify it as a parameter on the route. Personnaly I use it as a Session variable and in a user profile.

If you use this package, you can also export your application or part of it more easily, as many developers will use the same code.

you put all your words in json files:

 en.i18n.json: { "hello": "hello" } fr.i18n.json: { "hello": "bonjour" } 

and

 {{_ "hello" }} 

will write hello or bonjour depending on the langage set. You can install it with:

 TAPi18n.setLanguage(getUserLanguage()) //getUserLanguage() <- my function to get the current langage in the user profile or the one used by the navigator 

Answer 2

This module does what you are looking for.

https://github.com/TAPevents/tap-i18n-db

According to the developer: "Extends access: i18n package that allows you to transfer collections."

Answer 3

Finally, there is a package that is very complete (it also works with number formats, locales ...) and is often updated.

https://github.com/vazco/meteor-universe-i18n

You can also install https://atmospherejs.com/universe/i18n-blaze for use with a blade.

Just name your files with the locale.i80n.json template and its contents as

 { name: "english name", content: "english content" } 

then translate your lines with {{__ 'name'}} .