我正在处理一个应用程序中的 RSVP 表单,我正在尝试弄清楚如何让两个复选框相互镜像,当一个被选中时另一个没有被选中。现在,我的方法是将每个复选框绑定(bind)到 isComing
属性,其中一个复选框在 !isComing
上被选中,但它不是那样工作的。
这是我尝试过的:
HTML:
<script type='text/x-handlebars'>
<label>I'm coming!</label>
{{view Ember.Checkbox checkedBinding="isComing"}}
<label>I can't make it.</label>
{{view Ember.Checkbox checkedBinding="!isComing"}}
{{#if isComing}}
<p>The rest of the form will be here.</p>
{{/if}}
</script>
JS:
window.App = Ember.Application.create();
App.ApplicationController = Ember.ObjectController.extend({
isComing: false
});
这行不通。第一个复选框工作正常,但第二个复选框完全不受影响。显然,!isComing
是不允许的...
这在 jQuery 中是微不足道的,我想创建一个计算属性,第二个复选框绑定(bind)到它并监听 isComing
,但那些看起来不像 正确的方式。
使用 Handlebars 或 Ember 有更简单的方法吗? Here's the fiddle if you want to experiment.
最佳答案
如果你可以使用单选按钮,那么我会使用这个家伙的实现(http://thoughts.z-dev.org/2013/07/04/radio-buttons-in-ember-js/),简单干净
App.RadioButton = Ember.View.extend({
tagName : "input",
type : "radio",
attributeBindings : [ "name", "type", "value", "checked:checked:" ],
click : function() {
this.set("selection", this.$().val())
},
checked : function() {
return this.get("value") == this.get("selection");
}.property()
});
话虽如此,如果您不介意预先检查一个人,Adam 的回答同样好。
关于javascript - Handlebars/Ember.Checkbox - 2 个绑定(bind)的复选框,一个勾选为 false,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21208552/