dimanche 4 janvier 2015

Ember.Select cannot observe change to selection variable of dynamically generated control

I am dynamically building a number of select controls. I want to know when an option has changed so I am doing the following:


The idea there is that I dynamically create properties on the selections object which is used to hold the selected values.



//Add observer
Ember.defineProperty(selections, camelizedModelClass, null);
selections.addObserver(camelizedModelClass, self, 'selectionChanged');


Here is the function that should be called when selection has changed.



selectionChanged : function(sender, key, value, rev) {
console.log('worked!');
},


In my template I create Ember.Select's as follows.


{{#each control in controls}}



<div {{bind-attr class=":form-group control.width"}}>
<label for="exampleInputPassword1">{{control.label}}</label>
{{view "select"
content=control.content
selection=control.selection
optionValuePath=control.optionValuePath
optionLabelPath=control.optionLabelPath
class = "form-control"
prompt=control.prompt
}}
<p class="help-block"></p>
</div>


{{/each}}


Each control in the controls array has the following property.



selection: 'selections.' + camelizedModelClass,


The observer method is never called, however, if I manually enter the selection as follows it is in fact called.



{{view "select"
content=control.content
selection=selections.manager
optionValuePath=control.optionValuePath
optionLabelPath=control.optionLabelPath
class = "form-control"
prompt=control.prompt
}}


Why is this not working? The other weird thing is that if I put {{control.selection}} in my handlebars template I can see the model changing for the first method but not the second.





Aucun commentaire:

Enregistrer un commentaire