How do I set select option selected in Polymer 1.0?

<select id="typeSelect" style="width:100%;" value="{{item.type::change}}">
  <option value="">Choose a type</option>
  <template is="dom-repeat" items="{{types}}" as="type" >
    <option selected?="{{type==item.type}}">{{type}}</option>
  </template>
</select>

How do I set select option selected in Polymer 1.0?

<select id="typeSelect" style="width:100%;" value="{{item.type::change}}">
  <option value="">Choose a type</option>
  <template is="dom-repeat" items="{{types}}" as="type" >
    <option selected?="{{type==item.type}}">{{type}}</option>
  </template>
</select>

• javascript
• html
• polymer
• polymer-1.0

1 Answer 1

You were very close. Use this.

<select id="typeSelect" style="width:100%;" value="{{item.type::change}}">
  <option value="">Choose a type</option>
  <template is="dom-repeat" items="{{types}}" as="type" >
    <option selected$="{{selected(type,"yourtypetopare")}}">{{type}}</option>
  </template>
</select>

Now, add a function in your polymer's element.

  selected: function(item, type){
    return type == item.type;
  },