jeudi 8 janvier 2015

Input type='checkbox' two way binding doesn't work?

Just started learning ember.js, and currently working on the TODO MVC from their guide. I'm currently at this step: http://ift.tt/1AMSmvO


I noticed if I hook the "checked" property to a computed property, the two-way binding doesn't work as I would've expected. That computed property won't update the value if I check/uncheck the checkbox manually.


Here is the simplified example (as if their examples aren't simple enough):


Here is the handlebar code. I only added '{{allAreDone}}' element just to be able to see the value real time:



//...
<section id="main">
{{outlet}}
{{input type="checkbox" id="toggle-all" checked=allAreDone}}
{{allAreDone}}
</section>
//...


Here is the js snippet for the controller, but I simplified it such that it's not based on another property:



// ...
allAreDone: function(key, value) {
return false
}.property()
// ...


Now, if I check the box (i.e. property 'checked' = true), 'allAreDone' will still show false. The result will be different if the input type is text. Two way binding checkbox will also work if it's linked to a non-computed property such as:



// ...
allAreDone: false
//will return false if I uncheked the checkbox directly and vice versa
// ...


I just want to confirm my understanding of the behavior is correct. And why would it be different from type 'text'.


Thanks!





Aucun commentaire:

Enregistrer un commentaire