web-dev-qa-db-ja.com

オブザーバーは、Ember.jsで監視されたプロパティの前後の値をどのように見つけることができますか？

Ud3323によって提供される別の質問の解決策を参照してください： http://jsfiddle.net/ud3323/ykL69/ 。このソリューションは、赤い色を使用して変更された値を強調表示します。追加の要件があります。値が緑色のハイライトを増やした場合、赤色のハイライトを減らした場合。このためには、オブザーバーの古い値と新しい値を知る必要があります。これを行う方法はありますか？

P.S. Embersのドキュメントには、オブザーバー関数で利用できるものについては何も書かれていません。この例からわかるのは、オブザーバーがitemRowViewで定義されているため、「this」はitemRowViewを指しているということだけです。

ember.js
25
Naresh

beforeObserversを見てください。 beforeObserverは、プロパティが変更される前に発生します。したがって、beforeObserverでプロパティをgetすると、変更前の値が得られます。このタイプのオブザーバーは、Ember.addBeforeObserverを使用するか、observesBefore関数プロトタイプ拡張を介して設定します。

それはあなたがあなたの目標を達成するために必要なものをあなたに与えるでしょう。ここでこれを示すために、あなたのフィドルに基づいて次のJSBinを作成しました： http://emberjs.jsbin.com/qewudu/2/edit

Ember 1.7.xの動作を反映するために、2014-10-07に更新されました。

2015-02の更新：beforeObserverは非推奨になりました。この質問に対する他の回答を参照してください。

12
Luke Melia

beforeObserverは 非推奨 in 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);
})
16
Andrey Mikhaylov - lolmaus

willInsertElementを使用して初期値を保存し、値を変更したら、次の2つを比較します。

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/

2
Panagiotis Panagi

計算されたプロパティを使用してモデルのプロパティにルーティングし、最後の値をそのセットに格納しました。

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