ember.js Ember -如何将选定的选项值作为参数传递给操作处理程序

lvjbypge  于 2022-11-05  发布在  其他
关注(0)|答案(3)|浏览(126)

我是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)
      }
    }
});
f4t66c6m

f4t66c6m1#

如果您使用的是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

y4ekin9u

y4ekin9u2#

Ember处理<select>的方式从1.13开始发生了变化。使用HTMLBars现在允许我们直接向onchange属性添加一个action。至于传递值,您可以通过将target.value传递给action来实现:

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

Here's a sample twiddle

5n0oy7gb

5n0oy7gb3#

ember辛烷值

//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();

  }

相关问题