Ember - 如何将选定的选项值作为参数传递给动作处理程序答案

【问题标题】：Ember - How to pass selected option value as parameter to action handlerEmber - 如何将选定的选项值作为参数传递给动作处理程序
【发布时间】：2016-02-03 16:51:15
【问题描述】：

我是 ember 的新手。谁能帮助我如何将选定的值作为参数传递给操作处理程序“onSelectEntityType”。我已经尝试了以下操作，并且能够触发该操作。

<select class="form-control" id="entityType" {{action 'onSelectEntityType' on='change'}} >
    <option value="">Select</option>
    {{#each model as |entityType|}}
    <option value="{{entityType.id}}">{{entityType.entityTypeName}}</option>
    {{/each}}
</select>

组件js文件

import Ember from 'ember';

export default Ember.Component.extend({
    actions: {
      onSelectEntityType(value) {
         console.log(value)
      }
    }
});

【问题讨论】：

标签： javascript jquery ember.js ember-data

【解决方案1】：

如果您使用的是 Ember 1.13.3 或更高版本，您可以这样做：

<select class="form-control" id="entityType" onchange={{action 'onSelectEntityType' value="target.value"}} >
  <option value="">Select</option>
  {{#each model as |entityType|}}
    <option value="{{entityType.id}}">{{entityType.entityTypeName}}</option>
  {{/each}}
</select>

要获得比我能提供的更好的解释，请参阅：http://balinterdi.com/2015/08/29/how-to-do-a-select-dropdown-in-ember-20.html

【讨论】：

谢谢高拉夫。有效。以前我尝试过 {{action 'onSelectEntityType' value="target.value" on='change'}}，但没有奏效。
@Gaurav，知道我们如何在 ember 1.11 中做到这一点吗？
@whyAto8 你必须使用 {{view 'select'}}
好吧，我没有，因为我们计划很快升级 ember，但我看到它已被弃用。

【解决方案2】：

自 1.13 以来，Ember 处理 <select> 的方式发生了变化。使用 HTMLBars 允许我们现在直接向 onchange 属性添加操作。至于传递值，您可以通过将 target.value 传递给您的操作来做到这一点：

<select onchange={{action 'onSelectEntityType' value="target.value"}} >

Here's a sample twiddle

【讨论】：

【解决方案3】：

在余烬辛烷中

//component template  file
<select  {{on "change" this.setItemValue}}>
  {{#each @items as |item|}}
  <option value={{item}}>{{item}}</option>
  {{/each}}
</select>


 // component class file
 @action
  setItemValue(evt) {
    let itemValue = evt.target.value;
    evt.preventDefault();

  }

【讨论】：