объединение строк в свойстве, наблюдаемом в наблюдателе

У меня есть компонент, в котором я наблюдаю за свойством модели, а модель передается контроллеру в настройке контроллера как свойство контроллера «модель». Модель имеет свойства возраст, зарплата, ранг. Свойство в компоненте должно быть введено пользователем.

Компонент будет называться так:

{{ui-slider prop="age"}}

OR

{{ui-slider prop="salary"}}

Это не полный компонент, но он объясняет мою проблему. Компонент:

App.UiSliderComponent = Ember.Component.extend({

prop:function(){
    return this.get('prop');
}.property('prop'),

modelPropertyObserver:function(){
    console.log("property is "+this.get('targetObject.model').get(this.get('prop'));
}.observes('targetObject.model.'+this.get('prop')),

didInsertElement:function(){
   console.log("Element inserted");
}

})

Это не работает. Когда я наблюдаю такое свойство, как
.observes('targetObject.model.age')
, оно работает нормально.

Но теперь он показывает
cori_component.js:29 Uncaught TypeError: this.get is not a function

Я также пробовал .observes('targetObject.model.'+this.prop)
Хотя он не показывает никаких ошибок, но наблюдатель не работает.

Как связать свойство 'prop' с наблюдателем?
Или есть ли способ связать строку внутри компонента, а затем подставить ее в наблюдатель.


ember.js ember-components ember-model
person Vijay Malik    schedule 16.06.2016    source источник
comment
Вы пытались использовать литералы шаблонов ES6, такие как `targetObject.model.${this.get('prop')}`   -  person Jovica Šuša    schedule 16.06.2016

Ответы (2)


arrow_upward
1
arrow_downward

Вместо этого вы можете попробовать,

{{ui-slider prop=model.age}}

а также

modelPropertyObserver: Ember.observer('prop', function() {
    console.log("modelPropertyObserver");
})

Я не думаю, что приведенный ниже вариант является приемлемым.

.observes('targetObject.model.'+this.get('prop'))
person Ember Freak    schedule 16.06.2016
comment
это в этом контексте не определено. - person Patsy Issa; 16.06.2016
comment
Спасибо. Хотя это не точный ответ, который я искал, но я получил подсказку, как решить проблему. Теперь мой компонент работает как положено. - person Vijay Malik; 16.06.2016

arrow_upward
0
arrow_downward

Вы можете попробовать следующее, переопределив init и установив там свойство (я сделал это, чтобы иметь динамическое вычисляемое свойство). Я использую Babel, чтобы иметь функции ES2015 (такие как ...arguments и интерполяция строк)

init() {
this._super(...arguments);
this.set('value', Ember.computed(`model.${this.get('attribute')}`, function() {
  return this.get(`model.${this.get('attribute')}`);
}));
}

Я предполагаю, что в документации вы можете заменить Ember.computed на Ember.observer (и заменить соответствующую сигнатуру метода - фрагмент ниже скопировано из документации)

Ember.observer('value', function(sender, key, value, rev) {
// Executes whenever the "value" property changes
// See the addObserver method for more information about the callback arguments
}
person Pedro Rio    schedule 16.06.2016