2

オブザーバーを設定したフィールドを変更すると、オブザーバーは実行されません

App = Ember.Application.create();


App.Meeting = Em.Object.extend({
    id: null,
    name: null,
  proposes:{choice:5}
});

App.Meeting.reopen({
    proposedChanged: function() {
      var proposes = this.get('proposes');
      console.log(proposes);
      Ember.set(proposes, 'yesProcent', 'width:'+proposes.choice+'%');
      //this.set('proposes','width:'+10+'%');
      console.log(this);
    }.observes('proposes')
});

Ember.MyButton = Ember.Button.extend({
  click:function(){

      var meeting = this.get("meeting");

      meeting.proposes.choice = 10;

      Ember.set(meeting.proposes, 'choice', 10);
      meeting.set('proposes',meeting.proposes);
      console.log(meeting.proposes);
    }
});

App.meetingsController = Ember.ArrayController.create({
    content: [],
    loadList: function(){

        var me = this;

        var m = App.Meeting.create();
        m.setProperties({
          id : 1,
          name : 'Test',
          proposes: {choice:5}
        });

        me.pushObject(m);

    }
});

App.meetingsController.loadList();

私のプロジェクトからailikeコードがあり、オブザーバー属性（オブザーバーで変更される）を起動しても変更されません（その例では、属性yesProcentを意味します）。なんで？

サンプルjsbinへのソース

4

1 に答える 1

1

ここでいくつかのことが行われます。まず、プロパティが次のように直接設定されている場合、ember オブザーバーは起動しません。

meeting.proposes.choice = 10;
//Instead, use set like this:
meeting.set('proposes.choice',10);

さらに重要なことに、これはオブザーバーにとって適切な使用例ではありません。本当に必要なのは、計算されたプロパティです。http://emberjs.com/guides/object-model/what-do-i-use-when/を参照してください。

App = Ember.Application.create();

App.Meeting = Em.Object.extend({
    id: null,
    name: null,
    proposes: {choice:5},
    yesProcent: function() {
       return 'width:' + this.get('proposes.choice') + '%';
    }.property('proposes.choice')
});

Ember.MyButton = Ember.Button.extend({
  click:function(){
    this.incrementProperty('meeting.proposes.choice');
  }
});

App.meetingsController = Ember.ArrayController.create({
    content: [],
    loadList: function(){
        var m = App.Meeting.create({
          id : 1,
          name : 'Test',
          proposes: {choice:25}
        });
        this.pushObject(m);
    }
});

App.meetingsController.loadList();

ここで実際の例を参照してください: http://jsbin.com/avebok/5/edit

于 2013-07-23T01:54:13.677 に答える