javascripthtmlangularjsselectng-options

AngularJS select doesn't work without ng-model

Does anyone know why in AngularJS, the select selector doesn't work without the ng-model?

<select ng-model="bla_bla" ng-options="obj.value as obj.key for obj in languages"/>
<select ng-options="obj.value as obj.key for obj in languages"/>

The first line of code above will work while the second one will not work. Why ???

Thanks!

Solution

  • Using the select tag within an Angular app generates the ng-select directive, which is an HTML SELECT element plus angular data-binding. Looking in the Angular source for this select directive, here are the first few lines from its link method:

    link: function(scope, element, attr, ctrls) {
    // if ngModel is not defined, we don't need to do anything
    if (!ctrls[1]) return;
    ...

    So it is actually built into the framework to abort linking the directive if ngModel is not defined, and so no binding takes place.