Question

我的Ember应用程序是多语言的，语言可以在每个页面上更改（想想ATM或博物馆展示），我想在<header>元素中添加一个类来设置正确的语言。

我通过更改路由器中的I18n.locale = "en";来更改活动区域设置，但似乎无法更新元素上的类。我尝试创建这样的自定义标头组件：

Ember.LocalizedHeader = Ember.View.extend({
  tagName: "header",
  classNameBindings: ["locale"],
  locale: function() {
    return I18n.locale;
  }.property()
});

这有效，但在语言环境发生变化时不会更新值。

我如何告诉Ember：＆＃34;观察此值并相应更新课程＆＃34;？

谢谢！

Answer 1

创建一个全局设置，并观察它。大写通常表示生命在全局级别（App）的命名空间。

App.globalSetting = Ember.Object.create({
  language:'foo'
});

App.IndexView = Em.View.extend({
  language: function(){
    return App.globalSetting.get('language');
  }.property('App.globalSetting.language')
});

然后您可以使用setter从App.globalSetting.set('language', 'bar')

的任何位置更新属性

示例：http://jsbin.com/gubefumo/1/edit

您也可以使用POJO执行此操作，只需使用Ember.get和Ember.set即可确保正确触发和检索更改。

App.globalSetting = {
  language:'foo' 
};


App.IndexView = Em.View.extend({
  language: function(){
    return Em.get(App.globalSetting,'language');
  }.property('App.globalSetting.language')
});

Em.run.later(function(){
  Em.set(App.globalSetting,'language', 'bar');
}, 2000);

示例：http://jsbin.com/gubefumo/2/edit

将全局变量绑定到Ember中的视图

1 个答案: