Ember:动态切换到所选语言(使用i18n库) [英] Ember: dynamic switch to chosen language (using i18n library)

查看:112
本文介绍了Ember:动态切换到所选语言(使用i18n库)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用ember-i18n库翻译我应用程序中使用的静态字符串。由于语言文件相当大,我不想在应用程序启动所有可能的语言字典。因此,我想要在用户选择更改语言时动态加载字典。我已经做了一个很好的工作的第一个实现。

I am using the ember-i18n library for translation of static strings used throughout my application. As the language files are rather big, I do not want to load at application start all possible language dictionaries. I thus want to load the dictionary dynamically when the user chooses to change language. I have made a first implementation that works rather well.

请参阅 http://jsfiddle.net / cycmarc / RYbNG / 7 /

启动应用程序时,会以英文呈现。您现在可以选择其中一个视图(关于或信息),这些也以英文呈现。当您点击荷兰语时,荷兰语字典被加载,应用程序将以正确的语言重定向到索引路由。

When starting the app, it is rendered in english. You can now select one of the views (About or Info) and these are also rendered in english. When you click on 'Dutch', the dutch language dictionary is loaded and the application is redirected to the index route in the correct language.

似乎新的语言字符串仅当您转换到虚拟路由,然后返回到所需的路由(在我的示例中始终为索引)时才使用。

It seems that the new language strings are only used when you transition to a dummy route and then back to the route you want (in my sample this is always 'index').

updateLanguage: function (lang) {
    var _self = this;
    //Load correct dictionary and transition to index route
    $.getScript("http://libraries.azurewebsites.net/locales/dictionary_" + lang + ".js", function () {
      CLDR.defaultLanguage = lang;
      _self.transitionToRoute('I18redirect');
    });
  }

App.I18redirectRoute = Ember.Route.extend({
  activate: function () {
    this.transitionTo('index');
  }
});

我的问题:


  1. 这是否是重新加载view.template(转换为虚拟路由,然后激活转换为索引)的最佳方法?

  1. Is this the best way to reload a view.template (transition to dummy route and then on activate transition to index) ?

有没有办法转换回您要求更改语言的路由(需要使用get(path)等等)?

Is there a way to transition back to the route where you requested the language change (would need to use something with get(path) or so ) ?

我还要翻译字符串红外线(应用程序插座)。我转换回索引,但在这种情况下,应用程序模板不会重绘...可能是什么原因?

I would also like to translate the strings 'outside' the red div (the application outlet). I transition back to index, but in that case, the application template is not redrawn ... What could be the reason ?

这是预期的行为,当您离开模板然后重新输入模板时,模板本身将重建所有语言字符串,或者只是在同一时间语言改变了吗?如何在控制台日志中跟踪使用新字符串进行的模板重建?

Is it the expected behaviour that when you move away from a template and then re-enter the template, the template itself is rebuild with all the language strings, or is this only when in the meantime the language is changed ? How could such a rebuild of template with new strings be traced in console log ?

强大的切换解

推荐答案

我尝试了所有列出的方法,并且与所有这些都有各种各样的问题。我发现一个更优雅的黑客来做这个工作。

I tried all the ways listed here and had various issues with all of them. I found a much more elegant hack to make this work.

CAVEAT:只有当您使用Rails服务Ember(但可能适应任何服务器)边框架)。

CAVEAT: This only works if you are serving Ember using Rails (but could probably be adapted to work with any server-side framework).

在Rails中,i18n-js gem与Rails默认语言环境集成。 Ember中的动态切换是一个巨大的痛苦,因为您必须手动重绘所有视图或重置应用程序,以便在I18n.locale更改时获取更新的语言。

In Rails, the i18n-js gem integrates with Rails default locales. Dynamic switching in Ember is a huge pain because you must manually redraw all views or reset the app to get the language to update when I18n.locale is changed.

最佳方式我已经发现,要使用在Rails上设置的参数指定区域设置,Ember甚至加载。

The best way I have found to do it is to specify locale using parameters set on Rails, before Ember even loads.

RAILS配置:

使您的ember#index控制器操作如下所示:

Make your ember#index controller action look like this:

def index
  if params[:locale]
    I18n.locale = params[:locale]
  end
end

然后在你的html模板中,添加一行javascript:

Then in your html template, add this single line of javascript:

<html>
  <head>
    <%= stylesheet_link_tag :application, :media => :all %>
    <%= stylesheet_link_tag    "application", 'http://fonts.googleapis.com/css?family=Roboto:400,300,300italic,100,700' %>
    <%= stylesheet_link_tag    "application", 'http://fonts.googleapis.com/css?family=Roboto+Condensed:400,300,300italic' %>
    <%= javascript_include_tag :application %>
    <title>Review Blaster 9000</title>

<!-- SET LOCALE USING RAILS PARAMETER PARSING -->
    <script>I18n.locale = '<%=I18n.locale%>';</script>
<!-- END SET LOCALE -->

  </head>
  <body>

<!-- Start Ember.js -->
      <%= yield %>
<!-- End Ember.js -->

  </body>
</html>

然后在您的模板中,指定如下所示的语言切换器:

Then in your template, specify the language switchers like this:

<a href='/?locale=en'>English</a>
<a href='/?locale=es'>Spanish</a>
...etc...

点击这些链接将导致完全刷新的应用程序Rails将解析参数,设置I18n,然后Ember将以预先设置的正确值开始,所以一切都将正确绘制。

Clicking on those links will result in a complete refresh of the app. Rails will parse the parameter, set I18n and then Ember will start with the correct value already set beforehand, so everything will draw correctly.

这篇关于Ember:动态切换到所选语言(使用i18n库)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆