问题
This is a really basic question and I've been trying to figure it out to no avail. I'm integrating Google Maps with EmberJS and trying to do classNameBindings on a property within the IndexController that is being set by another view. The values get updated properly, but it doesn't fire. I've tried both property('controller.panoEnabled') and also .observes('controller.panoEnabled'). Neither fires... any idea? Help is much appreciated and I apologize for this rudimentary question.
JSBin: http://emberjs.jsbin.com/degivubu/4/edit
回答1:
I would advise isEnabled:Em.computed.alias('controller.panoEnabled') for the second option mentioned by Duncan Walker, as the property with the binding suffix has been 'softly' deprecated (https://github.com/emberjs/ember.js/issues/1164#issuecomment-23200023).
App.PanoView = Ember.View.extend({
classNames: ['pano'],
classNameBindings: ['isEnabled'],
/*isEnabled:function(){
return this.get('controller.panoEnabled');
}.property('controller.panoEnabled')*/
isEnabled:Em.computed.alias('controller.panoEnabled')
});
Also it is needed to fix the context of this in the google maps related code as shown below
http://emberjs.jsbin.com/vesiyana/1/edit
....
var self = this;
google.maps.event.addListener(marker, 'click', function(){
self.set('controller.panoEnabled',true);
console.log( self.get('controller.panoEnabled') ); });
google.maps.event.addListener(map, 'click', function(){
self.set('controller.panoEnabled', false);
console.log( self.get('controller.panoEnabled') ); });
....
回答2:
Try:
App.PanoView = Ember.View.extend({
classNames: ['pano'],
classNameBindings: ['isEnabled'],
isEnabled: function(){
return this.get('controller.panoEnabled');
}.property('controller.panoEnabled'),
});
or
App.PanoView = Ember.View.extend({
classNames: ['pano'],
classNameBindings: ['isEnabled'],
isEnabledBinding: 'App.IndexController.panoEnabled',
});
来源:https://stackoverflow.com/questions/24469784/emberjs-classnamebindings-w-observe-property-not-updating-firing