使用EmberJS进行本地化

Localization with EmberJS

本文关键字:本地化 EmberJS 使用      更新时间:2023-09-26

我有一个I18n应用程序,它通过返回JSON的ajax调用加载语言环境的翻译。

现在,它将JSON放入Em.STRINGS中。在HTML中,我有一个像这样的车把标签

{{translate context key="LOGOUT_LABEL"}}

我已经在我的JS中写了一个助手,看起来像这样

Ember.Handlebars.registerHelper('translate', function(property, options) {
    var key = options.hash && options.hash.key, 
    replacants = options.hash && options.hash.values, value;
    if (key) {
        value = Em.String.loc(key, replacants ? Em.String.w(replacants) : []); 
        return value ;
    }
});

运行时,首先绘制HTML,然后进行AJAX调用。所以,翻译实际上不会显示!我该如何解决这个问题?

这里是小提琴URL: http://jsfiddle.net/infinityat0/gBa7T/

这行不通:

var App = Em.Application.create({
    locale: 'en_US',
    init: function () {
        var locale = this.get('locale') || 'en_US';
        $.get("http://localhost:8000/translations.json", {
            locale: locale
        }, function (data) {
            Ember.STRINGS = data;
        });
    }
});

实际上你的小提琴工作,如果你替换AJAX-Call。对本地主机的ajax调用不能立即工作。在这里查看工作版本。

更新:如果您想为这个用例编写一个自己的助手,那么您必须创建一个绑定的助手。这在最新的ember版本(ember doc)中可用。您的代码可以像这样:

Em.Handlebars.registerBoundHelper('translate', function (property, options) {
    var key = options.hash && options.hash.key,
        replacants = options.hash && options.hash.values,
        value;
    if (key) {
        value = Em.String.loc(key, replacants ? Em.String.w(replacants) : []);
        console.log(value);
        console.log(Ember.STRINGS);
        return value;
    }
}, "Ember.STRINGS");

注意:有一个叫做ember-i18n的项目。您可能应该在此基础上构建,而不是在如此低级的api上工作。