Question

我有一个Ember.js应用程序（使用Ember CLI）。我有一个名为sideMenu的组件，文件sideMenu.js和sideMenu.hbs。在.js文件中，我有一系列车辆名称，如下所示：

export default Ember.Component.extend({
    vehicles: ['Audi', 'Chrysler', 'Harley Davidson'],
    vehicleCheckboxes: { 'Audi': true, 'Chrysler': true, 'Harley Davidson': true }
});

在我的这个组件的模板中，我循环遍历这些车辆并为每个项目创建一个复选框，如下所示：

{{#each vehicles as |vehicle|}}
    {{input type='checkbox' checked='true'}} {{vehicle}}
{{/each}}

这给了我想要的东西 - 旁边有车辆名称的几个复选框。我希望能够知道用户在此列表中取消选中/选中的内容。我尝试通过动态创建一些Ember属性并在模板中执行此操作：

{{input type='checkbox' checked="{{vehicleCheckboxes}}.{{vehicle}}"}}

这似乎不起作用。我怎么能做到这一点？在Ember文档中似乎没有任何迹象表明它可以在框架内以任何方式实现。

Answer 1

checked期望布尔值（true/false）你可以使用这个addon，如：

{{multiselect-checkboxes options=vehicles selection=selectedVehicles}}

或者你可以这样循环：

{{#each vehicles as |vehicle|}}
    {{input type='checkbox' checked=(get vehicleCheckboxes vehicle)}} {{vehicle}}
{{/each}}

并且您需要将vehicleCheckboxes转换为Ember.Object我认为如果它不能正常工作

vehicleCheckboxes: Ember.Object.create({ 'Audi': true, 'Chrysler': true, 'Harley Davidson': true })

Ember循环遍历一系列复选框并获取选中的项目？

1 个答案: