我正在尝试将第三方复选框与 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,展示了我上面的内容。