我正在尝试使用Ember的第三方复选框,但我无法让它工作。第三方复选框需要这样的标记:
<input type="checkbox" id="foo" name="bar" class="baz"/>
<label for="foo">blah</label>
我认为最简单的方法是创建我自己的视图FancyCheckbox来封装这种模式。主要障碍似乎是在标签的for
属性中使用复选框的ID。这是我试过的:
App.FancyCheckbox = Ember.Checkbox.extend({
templateName: 'fancyCheckbox',
tagName: '',
});
这是我使用的模板:
<script type="text/x-handlebars" data-template-name="fancyCheckbox">
<input type="checkbox" {{bindAttr id="view.elementId"}}/>
<label {{bindAttr for="view.elementId"}}/>
</script>
不幸的是,这并未正确获取复选框的事件。我认为这与缺乏封闭的div有关。但是当我创建一个封闭的div时,我无法弄清楚如何正确地将属性绑定连接到复选框。
这是一个jsfiddle,展示了我上面的内容。