Ember i18n Динамический текст для тега (с использованием заполнителя) - PullRequest
Новая
       14

Ember i18n Динамический текст для тега (с использованием заполнителя)

0 голосов
/ 04 декабря 2018

Я сейчас переводю приложение, используя библиотеку ember i18n.

С помощью заполнителя я могу перевести текст для тега, тем не менее, я могу передать тег только заполнителю, если данный текст является строкой.

Используемые теги являются обычными тегами i18n: 

example_tag : 'ejemplo'

Метод, который мы используем для заполнителя, который у нас сейчас есть, выглядит следующим образом: 

TranslationsPlaceHolder: (->{ 
    return Ember.I18n.t('example_tag');
})

икак мы его называем, это так: 

{{input value=view.example placeholder=view.TranslationsPlaceholder}}

В настоящее время я ищу способ, которым мы можем назначить разные теги с использованием одного заполнителя с динамическими тегами, чтобы мы могли передать тег, который мы хотимпереводить как параметр и использовать только один заполнитель с разными тегами.

Мы используем ссылку из этого вопроса: Вставка перевода в заполнитель с Emblem.js

Большое спасибо!

1 Ответ

0 голосов
/ 04 декабря 2018

Есть ли шанс, что вы могли бы реорганизовать код для использования нативного <input> вместо односторонней привязки?Вот twiddle , который показывает вам, что я имею в виду. 

<input value={{inputValue}} oninput={{action (mut inputValue) value="target.value"}} placeholder={{translate "placeholder"}} />

, где translate - помощник: 

const translations = {
  placeholder: "Type here"
};
export function translate(params/*, hash*/) {
  return translations[params] || `${params}_NOT_FOUND`;
}

export default Ember.Helper.helper(translate);

Вы можете безопасно переключиться наnative <input>, если вы> = Ember 2.3.1.

Если вы меньше этого (это единственный раз, когда я рекомендую делать то, что я предлагаю здесь, вместо одностороннего связывания),вы можете предоставить свою собственную обертку для компонента без тегов {{input}}, которая принимает ключ для заполнителя и выполняет перевод через вычисленные свойства.См. этот твидл для примера.

Ваш ввод становится: 

{{translated-placeholder-input value=value placeholderKey="placeholder"}}

, где translated-placeholder является компонентом без тегов: 

import Ember from 'ember';
const translations = {
  placeholder: "Type here..."
};
export default Ember.Component.extend({
  //creates the component without an enclosing div
  tagName: "",
  translatedPlaceholder: Ember.computed('placeholderKey', function(){
    let key = this.get('placeholderKey');
    if(!key){
      return ""; 
    }
    return translations[key] || `${key}_NOT_FOUND`;
  })
});

это просто переход к input

{{input value=value placeholder=translatedPlaceholder}}

Недостатком этого подхода (помимо всего, что идет с двухсторонней привязкой) является необходимость явно передавать любой атрибут, связанный с компонентом, в {{input}}

...