i18n Перевод динамически добавленного текста

Только что началось с i18n для перевода моего сайта в Node. Я немного потерял способ перевода текста, который генерируется после загрузки DOM и рендеринга jade-файла (например, после нажатия пользователем кнопки).i18n Перевод динамически добавленного текста

Я понимаю, что i18n является модулем на стороне сервера, и мой новый текст сгенерирован на стороне клиента.

У меня также работает экспресс, если это помогает.

Что я хочу сделать, так это возможность перевода текста, созданного javascript на стороне клиента. Рассмотрим произвольную кнопку:

INDEX.JADE 
    form.feedback-r 
     a#submitclientiddd.button.button-primary #{i18n.__('Reply')} 
    // Other Jade Stuff Here 
    script(src='javascripts/clientside.js', type='text/javascript') 

CLIENT SIDE JS 
    $("#posts").on("submit", "form.feedback-r", function(e) { 
     actbutton.html("Sending").addClass("feedback").removeClass('send_reply').prop("disabled", true); 
    }); 
... AJAX FUNCTION REQUEST AND ON SUCCESS ... 
     actbutton.html("Reply").addClass("success-text").prop("disabled", false); 

SERVER SIDE JS 
    res.render('index', { title: 'Page Title', i18n: res});

Первый текст кнопки, оказываемая нефритом через i18n с (i18n .__ ('Ответить')) и переведены правильно
Пользователь нажимает на кнопку
Текст изменен с помощью JQuery для чтения «Отправка», и после запроса AJAX обратно «не ответ»
текст кнопки больше не переводится, так как он был динамически генерируется

Есть ли способ использовать i18n на стороне клиента для решения этой проблемы? В самом идеальном случае, я хотел бы просто сделать это на стороне клиента, но это не работает:

actbutton.html(i18n.__('Reply'));

источник

2017-02-06 Michał

Я предлагаю начать здесь: https://www.npmjs.com/package/i18n-express на этой странице вы найдете начиная объяснение с этим пакетом, который я рекомендую.
Файл JSON должен содержать переведенные строки ключа/значения (независимо от того, на каком уровне он включен).
Рабочий раствор:

То, что я хочу сделать, это быть в состоянии перевести текст, который был создан с помощью JavaScript на стороне клиента.

В этом случае вам нужно будет манипулировать существующими данными в шаблоне (представлении), поскольку модуль i18 работает на стороне сервера.

Например, вы можете сохранить переведенный текст позже к-впрыснуть в эту самых кнопки внутри атрибута data-sent, как это:

//-INDEX.JADE 
form.feedback-r 
    a#submitclientiddd.button.button-primary(data-reply-text='#{i18n.__('Reply')}', data-sending-text='#{i18n.__('Sending')}') #{i18n.__('Reply')} 

//-CLIENT SIDE JS 
var sending_text = $('a#submitclientiddd').attr('data-sending-text'); 
$("#posts").on("submit", "form.feedback-r", function(e) { actbutton.text(sending_text); }); 

//-AJAX FUNCTION REQUEST AND ON SUCCESS 
var reply_text = $('a#submitclientiddd').attr('data-reply-text'); 
actbutton.text(reply_text); //(back to reply text)

источник

2017-02-06 14:02:41

Hi Nate! Спасибо за вашу помощь! Я обновил свой вопрос, надеюсь, предоставить более ясный пример моей проблемы. –

Очень интересное решение! Единственная проблема, которую я вижу, это то, что я не смогу перевести «Отправка» (как показано выше), поскольку она не будет определена ... В любом случае? –

Если у меня все получилось, то вам должно быть что-то вроде этого: в шаблоне JADE: '' button (data-translation-en = '# {ts'). = T ('buttons.sending')} ') = t ('buttons.hello') '' explain: # {t ('buttons.sending')} Функция t() оценивает строку из локального файла i18 с # {}, которую вы включаете в шаблон. –

мне удалось решить эту проблему, установив browser-i18n в общедоступном яваскрипте папки (не через NPM), а затем с использованием тех же функций на стороне клиента, что и с i18n на узле.

Проблема только в том, что браузер-i18n выглядит так, что он не поддерживает значения диапазона, например: [0] Ответить | [1,] Ответы. i18n-for-browser может быть возможным решением.

источник

2017-02-08 11:39:47

i18n Перевод динамически добавленного текста

ответ

Смежные вопросы