Select Element valueChanges observable fires twice every time

Version Alpha 46, TS

When trying to learn the various ways of working with forms I ran into an odd issue where select elements trigger change events twice for the same change when subscribed to the valueChanges observable.

If I have a function that changes the value from the model it only fires the change event once as expected.

It’s pretty short so heres my code:

@Component({
  selector: 'my-app',
})
@View({
  template: `
        <h3>Simple Select on App Component</h3>
        <form>
        <select [ng-form-control]="simpleSelect">
          <option value="1">One</option>
          <option value="2">Two</option>
          <option value="3">Three</option>
        </select>
        <button type="button" (click)="changeSelect()">Change Select to 3 From Model</button>
      </form>
  `,
  directives: [FORM_DIRECTIVES]

})
export class App {
  simpleSelect: Control = new Control('');
  counter: number = 0;
  constructor() {
    //watch simple select
    this.simpleSelect.valueChanges.subscribe((value)=>{
      console.log("Simple Select Val:" + value + " and counter:"+this.counter)
      this.counter++;
    });
  };
  changeSelect() {
    this.simpleSelect.updateValue(3);
  }
}

And Here is a Plunker of this in action.

I thought maybe it was something with how simple I was interfacing it so I did it with the FormBuilder and got the same results. I added a text field to see how it’s changes effect the form and they work correctly (only fire once) That Plunker Here

I’m not sure if I’m doing something incorrectly, but I think the expected behavior is the event to fire only once. I’m not experienced enough to track back whats causing the double bindings so I hoped I could have someone take a look at it…