从单选按钮选择中分配值的最佳方法

Best way to assign value from radio button selection

本文关键字：最佳 方法 分配 单选按钮 选择      更新时间：2023-09-26

我创建了这个小jsbin，为我的用例提供了框架：http://emberjs.jsbin.com/kufijixicu/1/edit?html,js,output

我试图以各种方式实现的是能够根据单选按钮列表中的选择分配color值。我相信有一个简单的解决方案。

解决方案还必须提供一种已在列表中选择潜在现有值的方法。因此，如果已选择color，则应在列表中选中所选的。

当前解决方案

我当前的解决方案可能无关紧要，但我会将其发布在这里以供参考。

如前所述，我已经尝试了各种解决方案。我目前在我的应用程序中拥有的那个工作如描述的那样，它有错误且混乱，这就是我寻找更好的解决方案的原因：

ColorController有一个操作，该操作附加到上面的 jsbin 中的<li>：

selectColor: function(color) {
  this.send('setColor', color);
  this.forEach(function(item) {
    item.set('isChecked', item.get('model') == color);
  });
}

IndexController具有setColor操作：

setColor: function(color) {
  this.set('color', color);
}

初始选择是通过ColorController上的这个观察器设置的：

colorsChanged: function() {
  if (this.filterBy('isChecked', true).get('length') == 0) {
    var selectedColorId = this.parentController.get('model.color_id')+'',
        selectedColor = this.filterBy('id', selectedColorId);
    if (selectedColor.get('length') == 0) return;
    selectedColor.objectAt(0).set('isChecked', true);
  }
}.observes('this.[]')

这似乎太混乱了，但它也不能 100% 工作。例如，单击单选按钮本身实际上会再次取消选中单选按钮。

在 Ember 中，单选按钮和复选框等内容最好包含在组件中。不幸的是，一些边缘情况阻止了Ember将单选按钮组件作为核心的一部分。

我要做的第一件事是看看其他人是否已经实现了这一点。您是否正在使用 Ember CLI？如果没有，你应该是。浏览余烬插件我找到两个单选按钮组件。

我会给余烬单选按钮一个镜头。

相关文章：