Angular ng-select do not start with last selected

Question

Hu,
another question to angular.

I have an array:

items = [
{"id":1,"name":"AAA"},
{"id":2,"name":"BBB"},
{"id":3,"name":"CCC"},
{"id":4,"name":"DDD"}
]

and my ng-select that is combined with a label by `{{ itemid }}

<select type="text" class="form-control form-control-small" 
ng-model="itemId" ng-options="item.id as item.name for item in items">
</select>

Now, when I select by the first time the first option is an "empty space" that I can not choose. But choosing an option makes the drop down closes. And when I click on my select again the last selected option is hightlighted.And I'd like to have the "empty space" as first option again.

Is it possible?

Answer 1

You can specify a blank option in your HTML as an 'option' element nested within the select ( from angular docs ):

    <select ng-model="myColor" ng-options="color.name for color in colors">
      <option value="">-- choose color --</option>
    </select>

Answer 2

Ye that's possible by resetting your itemId with a combination of ng-click and ng-change eg:

<select type="text" class="form-control form-control-small" 
ng-model="itemId" ng-options="item.id as item.name for item in items"
ng-click="reset()" ng-change="update()">
</select>

Use one to track when a change is made and only if a change is made and the element is clicked again reset itemId to 0

See this plnkr for an example: http://embed.plnkr.co/i0J0lCZwgnQ9YRoeKoHS/