Ember.js 现在不推荐使用Ember.Binding为动态属性创建别名

Ember.js 现在不推荐使用Ember.Binding为动态属性创建别名,ember.js,Ember.js,如何将别名或观察者添加到仅在组件初始化时才知道其名称的属性 我需要一个通用组件,其中属性名取决于传递给组件的数据。在以前的Ember版本中,我可以在init上创建绑定: binding = Ember.Binding.from("model.settings." + this.get('type')).to("setting"); binding.connect(this); 然后在任何需要的地方使用“设置”,当属性更改时或如果属性更改,所有内容都会正确更新。“type”属性是从外部传递给组件

如何将别名或观察者添加到仅在组件初始化时才知道其名称的属性

我需要一个通用组件,其中属性名取决于传递给组件的数据。在以前的Ember版本中,我可以在init上创建绑定:

binding = Ember.Binding.from("model.settings." + this.get('type')).to("setting");
binding.connect(this);
然后在任何需要的地方使用“设置”,当属性更改时或如果属性更改,所有内容都会正确更新。“type”属性是从外部传递给组件的,并且对于组件的每个实例都是不同的,因此我不能在组件本身中硬编码属性名称

现在,Ember.Binding在Ember 2.7中被弃用,并将在Ember 3.0中删除


如果没有Ember.Binding,我想不出如何实现这一点。不,据我所知,没有一种好的方法可以在没有绑定的情况下从其他地方传递值或管理它。实际组件比我上面描述的要复杂一些,但问题仍然是一样的。

您需要使用defineProperty为动态相关键创建computed属性

控制器/application.js

import Ember from 'ember';

export default Ember.Controller.extend({
  appName: 'Ember Twiddle',
  actions:{
    changeType(){
      this.set('model.settings.admin','changed-adminsettings');
    }
  }
});
模板/应用程序.hbs

{{my-component model=model type='admin' }}
<button {{action 'changeType'}}> ChangeType</button>
{{setting}}
{{yield}}
import Ember from 'ember';

export default Ember.Component.extend({
  init(){
    this._super(...arguments);  
    var type= this.get('type');    
    Ember.defineProperty(this,'setting',Ember.computed('model.settings.' + type,function(){
    return this.get('model.settings.'+type);
    }));
  }
});
my component.js

{{my-component model=model type='admin' }}
<button {{action 'changeType'}}> ChangeType</button>
{{setting}}
{{yield}}
import Ember from 'ember';

export default Ember.Component.extend({
  init(){
    this._super(...arguments);  
    var type= this.get('type');    
    Ember.defineProperty(this,'setting',Ember.computed('model.settings.' + type,function(){
    return this.get('model.settings.'+type);
    }));
  }
});
参考: