Issue with default selected state for an object

I just switched from using select2 to this addon and it’s awesome! Everything has worked great except for the default “selected” state. I’m not sure if this is a bug or if I’m doing something wrong on my end. Here is the code I’m working with:

Template:

{{#power-select
  options=repos
  selected=selectedRepo
  onchange=(action (mut selectedRepo))
  placeholder="Select repo"
  searchField="name"
  as |repo|}}
  {{repo.name}}
{{/power-select}}

Controller data:

repos: Ember.A([
  { name: 'ember', id: 'emberjs/ember.js' },
  { name: 'angular', id: 'angular/angular' },
  { name: 'backbone', id: 'jashkenas/backbone' },
  { name: 'knockout', id: 'knockout/knockout' }
]),

selectedRepo: { name: 'ember', id: 'emberjs/ember.js' }

There seems to be an issue with the equality statement for the selected value: https://github.com/cibernox/ember-power-select/blob/master/addon/helpers/ember-power-select-option-classes.js#L11. If you manually select a different item from the dropdown list the selected state successfully works. It just doesn’t work for the default selected state.

You can see a demo of this issue here: http://gregjopa.me/ember-reporting-dashboard/#/details. Demo code: https://github.com/gregjopa/ember-reporting-dashboard

Versions: Ember: 1.13.11 ember-power-select: 0.5.2

[cibernox]

@devop911 that said, I think I don’t oppose to your idea anymore, as long with the same option can take both a property name or a function to be invoked with the option.

Property name:

<PowerSelect @options={{opts}} @selected={{thing}} @onChange={{action (mut thing)}} @isEqual="id" as |opt|>
  {{opt}}
</PowerSelect}}

Function:

<PowerSelect @options={{opts}} @selected={{thing}} @onChange={{action (mut thing)}} @isEqual={{this.compareOptions}} as |opt|>
  {{opt}}
</PowerSelect}}

compareFunctions(o1, o2) {
  return o1.id === o2.id; // The compare function could be arbitrarily complex this way.
}

[JanAckermann]

This is a loveley Idea! Would love to see it in next version