Всем привет!
делаю на сайте мультиязычность, смена языка происходит с помощью выпадающего списка (select). После выбора другого языка, происходит и смена текста в самом select, но происходит это с видимой небольшой задержкой. Например, стоит язык "русский", при выборе "английский", доля секунды показывается "английский" русскими буквами, далее уже идет английский вариант! Как все реализовано: я создал реактивную переменную с тремя языками, и отслеживаю их изменения Tracker.autorun, далее с помощью хелперов передаю текст текущего языка. Собственно сам вопрос: как отслеживать полное изменение в реактивных переменных => изменение в хелперах? что-то подобное, как реализован waitOn в роутере, а на onBeforeAction передается шаблон загрузки, пока загружаются данные!
https://jsfiddle.net/63rzav52/
var langSite = new ReactiveVar('ru'),
objLang = new ReactiveDict(),
curObjLang = new ReactiveDict('curLang');
//объект с текстом разных языков
objLang.set('lang', {
ua: {
selectLang: {
ukrainian: 'Українська',
russian: 'Російська',
english: 'Англійська'
}
},
ru: {
selectLang: {
ukrainian: 'Украинский',
russian: 'Русский',
english: 'Английский'
}
},
en: {
selectLang: {
ukrainian: 'Ukrainian',
russian: 'Russian',
english: 'English'
},
}
}
//меняем наш язык в объекте по изменению в селекте
Template.layout.events({
'change #language': function(e) {
var valLand = $(e.target).val();
if (valLand === 'ru') {
langSite.set('ru');
}
else if (valLand === 'ua') {
langSite.set('ua');
}
else if(valLand === 'en') {
langSite.set('en');
}
}
});
//обработка изменений и передача в хелперы
Meteor.startup(function(){
Tracker.autorun(function(){
Template.layout.onRendered(function(){
$('#language').find('option[value='+ langSite.get() +']').attr('selected', 'selected');
});
if (langSite.get() === 'ru') {
curObjLang.set('curLang', objLang.get('lang').ru);
}
else if(langSite.get() === 'ua') {
curObjLang.set('curLang', objLang.get('lang').ua);
}
else if(langSite.get() === 'en') {
curObjLang.set('curLang', objLang.get('lang').en);
}
Template.switchLang.helpers({
ukraine: function(){
return curObjLang.get('curLang').selectLang.ukrainian;
},
russian: function(){
return curObjLang.get('curLang').selectLang.russian;
},
english: function(){
return curObjLang.get('curLang').selectLang.english;
}
});
});
});
//сам html
{{ukraine}}{{russian}}{{english}}