title: get selected object from options loop
body: <p>I'm trying to find a way to bind array of objects within Vue select-element. The case is somewhat as follows:</p>
  
  <pre><code>data: {
    ideas: [
      { id: 1, code: "01A", text: "option 1", props: [] }, 
      { id: 2, code: "02A", text: "option 2 , props: [{ details: "something" }]}
    ]},
    currentForm: {
      something: "foo",
      else: "bar",
      ideaCode: "01A",
      text: "option 1"
    }
  ];
  </code></pre>
  
  <p>... and in HTML ...</p>
  
  <pre><code>&lt;select v-model="currentForm.ideaCode" @change="setCodeAndLabelForForm(???)"&gt;
    &lt;option v-for="i in ideas" value="i"&gt;{{ i.text }}&lt;option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>Basically I need to be able to track which <strong>object</strong> user selects, trigger my own change-event, all the while having binding with a single key from another object... selected value / reference-key should be separated from user-selected option/object. <strong>Note: currentForm is not same object-type as option! It only contains some of those properties which option happens to have, and which I'm trying to transfer to options by triggering change-event for user-selection.</strong></p>
  
  <p>The problem is I haven't figured out how to pass currently selected value for the function OR how to write something like:</p>
  
  <pre><code>&lt;select v-model="selectedIdea" @change="setCodeAndLabelForForm" :track-by="currentForm.ideaCode"&gt;
    &lt;option v-for="i in ideas" value="i"&gt;{{ i.text }}&lt;option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>One possible (and working) approach is:</p>
  
  <pre><code>&lt;select v-model="currentForm.ideaCode" @change="setCodeAndLabelForForm"&gt;
    &lt;option v-for="i in ideas" value="i.ideaCode"&gt;{{ i.text }}&lt;option&gt;
  &lt;/select&gt;
  
  setCodeAndLabelForForm: function() {
      var me = this;
      this.ideas.forEach(function(i) {
          if(i.ideaCode == me.currentForm.ideaCode) {
              me.currentForm.ideaCode = i.selectedIdea.ideaCode;
              me.currentForm.text = i.text;
              ... do stuff &amp; run callbacks ...
          }
      });
  }
  </code></pre>
  
  <p>... but it just seems terrible. Any better suggestions?</p>