Angular2 data binding does not work with select dropdown

Question

I am using Angular version 2.0.0. I have a menu with a list of choices, and I want to set the default one explicitly and also if any option is changed, I want to know which one was changed by using two way data binding.

I have this in my html

<select [(ng-model)]="cosResponse.systemSelection.selected" (ng-model-change)="onChange(cosResponse.systemSelection.shouldRefresh)">

but then in the browser, I get this error: Can't bind to 'ng-model' since it isn't a known property of 'select' It isn't a problem with importing FormsModule or ReactiveFormsModule since my other elements like a checkbox, etc work fine with [(ng-model)]. It is only the select that is not working with two way data binding.

Answer 1

You should be using camelCase. E.g.,

<select 
  [(ngModel)]="cosResponse.systemSelection.selected"
  (ngModelChange)="onChange(cosResponse.systemSelection.shouldRefresh)">

See docs.