Где я могу разместить переводы Ember-I18n в Ember-CLI?

Я новичок в Ember и Ember-Cli, и я все еще учусь, где все идет. Я пытаюсь добавить многоязычную поддержку с модулем ember-i18n.

У меня есть зависимости, установленные с беседкой

bower install cldr ember-i18n --save

И мой импорт работает в Brocfile.js

app.import('vendor/cldr/plurals.js');
app.import('vendor/ember-i18n/lib/i18n.js');

В моем приложении работает помощник руля i18n

{{t hello}} дает мне "Отсутствует перевод: привет"

Я не знаю, куда поместить или ссылаться на файл в структуре папок ember-cli, которая содержит переводы.

Согласно документу, это выглядело бы примерно так

Ember.I18n.translations = {
    hello: "Hello World",
}

Я пытался вставить его в app.js просто чтобы увидеть, как это работает, но получил ошибку:

Uncaught TypeError: Cannot set property 'translations' of undefined
Источник

3 ответа

Решение

Вы можете добавить свои переводы в initializer ( документы здесь). С Ember-Cli вы можете создать один, выполнив ember generate initializer i18n в командной строке.

В инициализаторе вы можете установить переводы:

var TRANSLATIONS = {
  'user.edit.title': 'Edit User',
  'user.followers.title.one': 'One Follower',
  'user.followers.title.other': 'All {{count}} Followers',
  'button.add_user.title': 'Add a user',
  'button.add_user.text': 'Add',
  'button.add_user.disabled': 'Saving...'
};
var i18nInitializer = {
  name: 'i18n',
  initialize: function() {
    Ember.I18n.translations = TRANSLATIONS;
  }
};
export default i18nInitializer;

Если вы хотите получить языковые данные через ajax в java-properties файл, который вы можете получить с помощью ajax и проанализировать с помощью java-properties.js. Это также доступно через Бауэр

Источник

У меня были те же проблемы, что и у Уэстона, и после некоторых исследований я реализовал решение, которое может динамически загружать язык, указанный пользователем. Это, вероятно, слишком поздно для ФП, но я выкладываю его здесь для дальнейшего использования для всех, у кого могут возникнуть вопросы об этом процессе.

Мое решение, возможно, не идеальный способ справиться с этим, но, похоже, оно хорошо работает с моим сайтом.

Я использую Ember-cli и включил ember-i18n для интернационализации, а также CLDR для обработки множественного числа. Мой сайт использует файл cookie для хранения языка пользователя, который используется для загрузки соответствующего языкового файла при загрузке сайта. Файл cookie также передается службе REST (некоторые вызовы API возвращают объекты, которые могут содержать переведенный текст). Я использую jQuery-cookie для обработки файлов cookie.

Сначала я создал свои файлы переводов, по одному для каждого языка, которые являются просто файлами javascript, которые я затем загружу, используя $.getScript. Я сохранил их в папке "translations" в папке public/javascript, созданной Ember-cli.

переводы-en.js

Ember.I18n.translations = {
  'hello' : 'Hello World!',
  ...
}

переводы-fr.js

Ember.I18n.translations = {
  'hello' : 'Bonjour Monde!',
  ...
}

Затем я устанавливаю инициализатор для CLDR, который устанавливает язык по умолчанию на основе куки-файла пользовательского языка, используемого моим сайтом - если куки-файл еще не существует, по умолчанию используется значение "en" и создается cookie-файл.

\ приложение \ Инициализаторы \cldr.js

export default {
  name: 'cldr',

  initialize: function() {
    var lang = $.cookie('user-lang');

    if (lang === undefined) {  // no cookie exists yet
      lang = 'en';
      $.cookie('user-lang', lang, {expires:365, path:'/'});
    }

    CLDR.defaultLanguage = lang; 
  }
};

Теперь в функции beforeModel Application Route я получаю файл переводов на основе значения, хранящегося в CLDR.defaultLanguage.

\ APP \ маршруты \ application.js

export default Ember.Route.extend({

  beforeModel: function() {
    $.getScript('./javascript/translations/translations-' + CLDR.defaultLanguage + '.js')
      .fail(function(jqxhr, reason, exception) {
        // handle failure
      });
  }
});

Если на вашем сайте имеется большое количество строк перевода или много языков, возможно, вы не захотите включать файлы перевода каждый раз, когда кто-то загружает ваше приложение, или загрузка может занять некоторое время. В этом случае вы можете заменить этот getScript на вызов ajax и получить файл, обслуживаемый вашим бэкэндом. В моем случае не так много строк перевода, так что это нормально.

Теперь в любое время, когда пользователь хочет изменить язык, все, что мне нужно сделать, это обновить значение моего cookie-файла пользователя, а затем перезагрузить сайт, который снова пройдет через инициализатор и beforeModel и загрузит соответствующий языковой файл.

export default Ember.Controller.extend({
  actions: {
    changeLanguage: function(lang) {
      $.cookie('user-lang', lang); 

      window.location.reload();
    }
  }
});

Каждый раз, когда пользователь перезагружает страницу или возвращается на сайт, его последний выбранный язык будет загружен из файла cookie по умолчанию. Конечно, пользователь может удалить свой cookie или войти в другой браузер, и в этом случае сайт вернется к языку по умолчанию "en". Чтобы обойти это, выбор языка пользователя должен сохраняться где-то на бэкэнде и извлекаться при загрузке приложения - но это еще одна задача.

Источник

Пространство имен неверно.

Тебе нужно Em.I18n.translations,

Попробовал это. Работает.

Я не знаю, куда поместить или ссылаться на файл в структуре папок ember-cli, которая содержит переводы.

И я нет. Конечно app.js работает, но, возможно, кто-то может дать хороший совет. Я довольно новичок во всем, что связано с угасанием...

Источник
Другие вопросы по тегам