Как наблюдатель может узнать до и после значения наблюдаемого свойства в Ember.js?

См. решение другого вопроса, предоставленного ud3323: http://jsfiddle.net/ud3323/ykL69/. Это решение подчеркивает измененное значение с использованием красного цвета. У меня есть дополнительное требование: если значение увеличило выделение в зеленом цвете, если оно уменьшило выделение красным цветом. Для этого мне нужно знать старые и новые ценности в моем наблюдателе. Есть ли способ сделать это?

P.S. В документах Embers ничего не говорится о том, что доступно в функции наблюдателя. Все, что я могу сказать из примера, состоит в том, что, поскольку наблюдатель определен в itemRowView, "this" указывает на itemRowView.

Ответы

Ответ 1

Взгляните на beforeObserver s. A beforeObserver срабатывает перед изменением свойства. Поэтому, если вы get свойство в beforeObserver, вы получите значение перед изменением. Вы настраиваете этот тип наблюдателя с помощью Ember.addBeforeObserver или через расширение прототипа функции observesBefore.

Это даст вам то, что вам нужно для достижения вашей цели. Я создал следующий JSBin, основанный на вашей скрипке, чтобы продемонстрировать это здесь: http://emberjs.jsbin.com/qewudu/2/edit

ОБНОВЛЕНО на 2014-10-07, чтобы отразить поведение в Ember 1.7.x.

UPDATE в 2015-02: beforeObserver устарел. Другие ответы на этот вопрос.

Ответ 2

beforeObserver был устарел в Ember 1.10.

Вместо этого используйте ручной кеш:

doSomething: Ember.observer( 'foo', function() {
  var foo = this.get('foo');
  var oldFoo = this.get('_oldFoo');

  if (foo === oldFoo) { return; }

  // Do stuff here

  this.set('_oldFoo', foo);
})

Ответ 3

Используйте willInsertElement, чтобы сохранить начальное значение, и после изменения значения сравните два:

Quotes.itemRowView = Ember.View.extend({
    tagName: 'tr',

    initialValue: null,

    willInsertElement: function(){
        var value = this.get('content').value;
        this.set('initialValue', value); 
    },

    valueDidChange: function() {
        // only run if updating a value already in the DOM
        if(this.get('state') === 'inDOM') {
            var new_value = this.get('content').value;
            // decreased or increased?
            var color =  (new_value > this.get('initialValue') ) ?
                'green' : 'red' ;
            // store the new value
            this.set('initialValue', new_value);
            // only update the value element color
            Ember.$(this.get('element')).find('.quote-value').css('color', color);
        }
    }.observes('content.value')
});

Взгляните на jsfiddle http://jsfiddle.net/ykL69/15/

Ответ 4

Я использовал вычисляемое свойство для перехода к свойству модели и сохранил последнее значение по его набору.

registrationGroup: Em.computed('regionModel.registrationGroup', 
get:->
  @.get('regionModel.registrationGroup')
set:(key, value, oldValue)->
  @.set('lastRegistrationGroup', oldValue)
  @.set('regionModel.registrationGroup', value)
)