Где я помещаю переводы для Ember-I18n в Ember-CLI?

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

У меня есть зависимости, установленные с bower

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}} дает мне "Missing translation: hello"

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

В документе ember-i18n он выглядел бы как-то вроде этого

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

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

Uncaught TypeError: Cannot set property 'translations' of undefined

Ответ 1

Вы можете добавить свои переводы в initializer (docs здесь). С 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. Он также доступен через Bower

Ответ 2

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

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

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

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

переводческая en.js

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

переводческая fr.js

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

Затем я устанавливаю инициализатор для CLDR, который устанавливает язык по умолчанию на основе пользовательского файла cookie, используемого моим сайтом - если cookie еще не существует, он по умолчанию имеет значение "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; 
  }
};

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

\приложение\маршруты\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 user-lang, а затем перезагрузить сайт, который снова пройдет через функции initializer и beforeModel и загрузит соответствующий языковой файл.

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

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

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

Ответ 3

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

Вам нужно Em.I18n.translations.

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

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

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