Polymer实现native select元素

时间:2016-02-22 15:20:10

标签: select polymer native element

我正在使用带有选项的原生选择来实现聚合物自定义元素。

<select id="selectbox" value="{{selectedId::change}}">
  <template is="dom-repeat" items="{{arrayItems}}" >
    <option value="{{item}}" id="{{item}}">{{item}}</option>
  </template>
</select>

https://jsfiddle.net/fiddle_gabriela/a58L52yh/2/

selectedId表示要在选择框中选择的项目的ID (第一个元素为1,第二个元素为2,等等。)

在创建选择框时,我想选择列表中的第4个元素 问题是selectedId获取元素的值(例如,许可,警报,......)而不是其ID。

如何获取id而不是值?

更新预期结果(来自评论)

<select> 
  <option value="admission">admission</option> 
  <option value="alert">alert</option> 
  <option value="bvt_sample">bvt_sample</option> 
  <option value="clinicalpath" selected > clinicalpath</option> 
</select>

1 个答案:

答案 0 :(得分:1)

您可以使用函数检查当前项目是否与实际选择的项目相同。

<option value="{{item}}" id="{{item}}" selected="{{isSelected(item)}}">
isSelected: function(item) {
  console.log(item);
    return item === this.selectedId;
}

https://jsfiddle.net/zkrb4jkz/