Question

我是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}}给了我＆＃34;缺少翻译：你好＆＃34;

我不知道在包含翻译的ember-cli文件夹结构中放置或引用文件的位置。

每个ember-i18n文档看起来都像这样

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

我尝试将其粘贴在app.js只是为了看到它正常工作，但却收到了错误：

Uncaught TypeError: Cannot set property 'translations' of undefined

Answer 1

您可以在initializer（docs here）内添加翻译。使用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;

如果要通过java-properties文件中的ajax检索语言数据，可以使用ajax检索它并使用java-properties.js进行解析。它也可以通过Bower

获得

Answer 2

我遇到了与韦斯顿相同的问题，经过一些研究，我已经实现了一个可以动态加载用户指定的语言的解决方案。对OP而言可能为时已晚，但我将其放在此处以供将来参考可能对此过程有疑问的任何人。

我的解决方案可能不是处理此问题的理想方式，但它似乎可以很好地与我的网站配合使用。

我使用Ember-cli并包含ember-i18n用于国际化，以及CLDR用于处理复数形式。我的网站使用cookie来存储用户语言，用于在网站加载时加载相应的语言文件。 cookie也传递给REST服务（一些API调用返回可能包含翻译文本的对象）。我正在使用jQuery-cookie进行cookie处理。

首先，我创建了我的翻译文件，每种语言一个，这些文件只是我将使用$ .getScript加载的javascript文件。我将它们存储在翻译中。 public / javascript文件夹中的文件夹Ember-cli创建。

<强>翻译-en.js

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

<强>翻译-fr.js

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

然后我为CLDR设置了初始化程序，它根据我的网站使用的用户级Cookie设置默认语言 - 如果Cookie尚未存在，则默认为“＆＃39; en＆＃39;并创建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
      });
  }
});

如果您的网站包含大量翻译字符串或多种语言，您可能不希望每次有人加载您的应用时都包含您的翻译文件，否则可能需要一段时间才能加载。在这种情况下，您可以使用ajax调用替换此getScript，并获取后端提供的文件。在我的情况下，没有太多的翻译字符串，所以这是好的。

现在，只要用户想要更改语言，我所要做的就是更新user-lang cookie的值，然后重新加载该站点，该站点将再次通过初始化程序和beforeModel函数并加载相应的语言文件

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

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

每当用户重新加载页面或返回站点时，默认情况下都会从cookie加载他们上次选择的语言。当然，用户可以删除他们的cookie或从其他浏览器登录，在这种情况下，该网站将返回默认的＆＃39; en＆＃39;语言。为了解决这个问题，用户的语言选择需要在后端的某个地方保留，并在app load上获取 - 但这是另一项任务。

Answer 3

命名空间错误。

您需要Em.I18n.translations。

试过了。的工作原理。

我不知道在包含翻译的ember-cli文件夹结构中放置或引用文件的位置。

我也不是。当然app.js有效，但也许有人可以提供一个很好的提示。我对所有那些ember-cli的东西都很陌生......

我在哪里可以将Ember-I18n的翻译放在Ember-CLI中？

3 个答案: