generic-select-opt-path.js

import Ember from 'ember';

const genericSelectOptPath = function([opt, path]) {
  if (path) {
    return opt.get(path);
  } else {
    return opt;
  }
};

export { genericSelectOptPath };

export default Ember.HTMLBars.makeBoundHelper(genericSelectOptPath);

generic-select.hbs

<select onchange={{action "updateValue"}} id={{selectId}}>
  {{#each options as |opt|}}
    <option value={{generic-select-opt-path opt optValuePath}} selected={{ default-selected value opt options }}>
      {{generic-select-opt-path opt optLabelPath}}
    </option>
  {{/each}}
</select>

generic-select.js

import Ember from "ember";
import { genericSelectOptPath } from 'frontend/helpers/generic-select-opt-path';

export default Ember.Component.extend({
  didInsertElement: function() {
    if (!this.get('value')) {
      return this.set('value', genericSelectOptPath([this.get('options.firstObject'), this.get('optValuePath')]));
    }
  },
  actions: {
    updateValue: function(e) {
      return this.set('value', Ember.$(e.target).val());
    }
  }
});

invocation.hbs

{{ generic-select options=stateOptions value=value id=selectId optLabelPath="firstObject" optValuePath="lastObject"}}