ember select-box component

component.js

import Ember from "ember";

export default Ember.Component.extend({
  content: null,
  selectedValue: null,

  didInitAttrs(attrs) {
    this._super(...arguments);

    if (!this.get('content')) {
      this.set('content', []);
    }
  },

  actions: {
    change() {
      const selectedEl = this.$('select')[0];
      const selectedIndex = selectedEl.selectedIndex;
      const content = this.get('content');
      const selected = content[selectedIndex];

      this.set('selectedValue', selected.value);
    }
  }
});

template.hbs

{{#if label}}
  <label>{{label}}</label>
{{/if}}

<select {{action 'change' on='change'}}>
  {{#each content key="@index" as |item|}}
    <option value="{{item.value}}" selected={{is-equal item selectedValue}}>
      {{item.text}}
    </option>
  {{/each}}
</select>