title: Ember Select set default value
body: <p>Even after reading a lot of doc, I'm still not able to accomplish this simple task;</p>
  
  <p>I have a select view in my template:</p>
  
  <pre><code>{{view Ember.Select id="id_diff" contentBinding="difficulties" optionValuePath="content.id" optionLabelPath="content.title" valueBinding="selectedDifficulty"}}
  </code></pre>
  
  <p>this select is filled correctly with this data:
      {id: 1, title: easy}{id: 2, title: medium}{id: 3, title: hard}</p>
  
  <p>I just want to set the default value to "medium" instead of easy that is the default value now; how can I do this?</p>
  
  <p>The Controller:</p>
  
  <pre><code>Gmcontrolpanel.InsertActivityController = Em.Controller.extend({
  difficulties: function() {
      var difficulties = [];
      difficulties = this.get('store').find('difficulty');
      return difficulties;
  }.property(),
  changeDifImg: function() {
      jQuery('.diff-icon').animate({'opacity': 0}, 300);
      jQuery('#diff-img' + jQuery('#id_diff').val()).animate({'opacity': 1}, 300);    
  }.observes('selectedDifficulty'),
  startValue: null
  });
  </code></pre>
  
  <p>The ChangeDifImg property is used to change the associated difficulty icon when user changes the value in the select;</p>
  
  <p>(in the template:</p>
  
  <pre><code>{{#each difficulty in difficulties}}
          &lt;img class="diff-icon" id="diff-img{{unbound difficulty.id}}" src="{{unbound "difficulty.link"}}" style="opacity: 0" /&gt;
          {{/each}}
  </code></pre>
  
  <p>this creates one immage for every difficulty and set them all invisible; then when the user selects a value in the Select, the changeDifImg property shows the correct icon</p>