Working with AngularJS, I am creating a listbox using the select element and ng-repeat. Everything seems to be functioning correctly, but I am encountering an issue where a blank item is displayed at the top of the listbox.
Here is the snippet of my HTML code:
<select size="6" ng-model="item" ng-options="s.name for s in itemlist"></select>
<button class="btn tt-btn-blue" ng-model="singleModel" ng-click="onLoadClicked(item.id)">Load</button>
When inspecting the listbox in Chrome's console, this output is shown:
<select size="6" ng-model="item" ng-options="s.name for s in itemlist" class="ng-pristine ng-valid">
<option value="?" selected="selected"></option>
<option value="0">Item 1</option>
<option value="1">Item 2</option>
<option value="2">Item 3</option>
<option value="3">Item 4</option>
<option value="4">Item 5</option>
<option value="5">Item 6</option>
</select>
I am seeking a solution to remove this first blank option inserted by ng-repeat. While setting the first actual option as selected could be a workaround, I prefer to have no default selection when the listbox is initially loaded.