title: How to get the value in a select change event in angular2
body: <p>I want to navigate useing a dynamically generated select drop down.
  It doesn't appear I can do that directly, so I'd simply like to make a function call when the select changes.</p>
  
  <p>To do that, I have this:</p>
  
  <p>---In the template---</p>
  
  <pre><code>&lt;select (change)="navSelected($event)"&gt;
      &lt;option *ngFor="let button of navButtons;"
      value="button.route" &gt;{{button.label}}&lt;/option&gt;
  &lt;/select&gt;
  </code></pre>
  
  <p>suffice it to say that 'navButtons' is an array of objects that have a 'label' field.</p>
  
  <p>---In the class---</p>
  
  <pre><code>navSelected(navName) {
      console.log(navName + " Clicked!");
  }
  </code></pre>
  
  <p>This actually works fine.</p>
  
  <p>I got to this point from the great help of Mark Rajcok and his answer in this older question:
  <a href="https://stackoverflow.com/questions/33700266/how-can-i-get-new-selection-in-select-in-angular-2">How can I get new selection in &quot;select&quot; in Angular 2?</a></p>
  
  <p>That said, I'd like to be able to pass the selected value in the navSelected() function call.  I'm unsure how to do that.</p>
  
  <p>I have tried adding <code>[ngValue]="button"</code> on a wild guess from other searches to the option tag and then referencing the <code>button</code> variable in the <code>(change)</code> event handler (so: <code>(change)="navSelected(button.label)"</code> and other combos, to no avail.   I've seen a lot of references to ngModel but they seem old and I'm not entirely sure they apply anymore (and I couldn't get them to work anyway in RC4).</p>
  
  <p>I could probably pull some jquery or whatever out to find the select and get it's value, but that seems very rinky-dink compared to simply being able to call the function correctly.</p>