My <select>
element has an ng-model
, and one of the options is a space. When the initial value is something other than a space, Angular selects the correct option. However, when the initial value is a space, Angular adds an empty option.
This behavior can be replicated with the following HTML:
<select ng-model="a" ng-trim="false">
<option value=" ">Default</option>
</select>
<select ng-model="b">
<option value="x">Default</option>
</select>
and using a controller like this:
$scope.a = " ";
$scope.b = "x";
The first select field will have a blank option, while the second will display "Default". The use of ng-trim
does not resolve this issue, and since the values are fetched from a database, they cannot be easily modified.
This problem persists across versions of Angular including 1.4.8, 1.4.9 (the version in use), and 1.5.8. These versions are accessible at https://code.angularjs.org/.
A live demonstration of the issue is available in this fiddle: https://jsfiddle.net/d1cj3kzb/4/.
I am seeking a solution that will allow the <select>
element to display the correct option even when ng-model
is initialized to a space.