Reputation: 181
I am experiencing a couple of unusual behaviors with a property observer for Ember. Please see this jfiddle for the code in action: http://jsfiddle.net/sBVtJ/3/
More discussion on behavior 2: When first loading the app, you can click "change multiple properties action" and the properties will begin incrementing. However the observer is not fired. Now navigate to the observer route. When you increment the properties, the observer will fire. Then navigate back to the index route. The observer will continue to fire on property increment. Now each time the properties are incremented from either route, the observer is fired. My intended behavior is to only have the observer fire when the observer route is active. Any way to achieve this?
And my question for behavior 1: Notice that the observer fires twice whenever the properties are updated, even though they are updated simultaneously. When updating two properties simultaneously, is it possible to have the observer fire only once?
App = Ember.Application.create();
App.Router.map(function(){
this.resource('observer');
});
App.Router.reopen({location:'none'});
App.ApplicationController = Ember.Controller.extend({
consoleProp: function(){
console.log(this.get('controllers.application.prop1'));
},
changeTwoProperties: function(){
this.get('controllers.application').incrementProperty('prop1');
this.get('controllers.application').incrementProperty('prop2');
},
prop1:0,
prop2:0
});
App.IndexController = Ember.Controller.extend({
needs: ['application'],
changeTwoPropertiesBinding: 'controllers.application.changeTwoProperties',
consolePropBinding: 'controllers.application.consoleProp'
});
App.ObserverController = Ember.Controller.extend({
needs: ['application'],
changeTwoPropertiesBinding: 'controllers.application.changeTwoProperties',
consolePropBinding: 'controllers.application.consoleProp',
theObserver: function(){
console.log('observer fired');
}.observes('controllers.application.prop1', 'controllers.application.prop2')
});
Upvotes: 2
Views: 966
Reputation: 5517
For the first part, use Ember.beginPropertyChanges()
and Ember.endPropertyChanges()
. See this SO answer for more info
Ember.beginPropertyChanges();
this.get('controllers.application').incrementProperty('prop1');
this.get('controllers.application').incrementProperty('prop2');
Ember.endPropertyChanges();
For the second behavior, it requires more research. I think the ObserverController
is not created before you visit the observer route, but when you leave the route, it is not destroyed..
Upvotes: 1