Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ng-options how to set first select always blank

I am using angularjs in a project and in which I am using ng-options for generating .

Initially when the pages reload and no option element is selected the html generated like below:

<select size="3" ng-model="item" ng-options="s.name for s in itemlist"> <option value="?" selected="selected"></option> <option value="0">Item 1</option> <option value="1">Item 2</option> <option value="2">Item 3</option> </select> 

But when I select an element (ex. Item 2) the first blank select is gone. I know its happening as ng-model is being set by select value. But I want first select always blank so that user can reset the filter.

Thanks in advance.

like image 834
arnold Avatar asked Oct 04 '13 13:10

arnold


People also ask

How do I set default selected value in ng-options?

In my opinion the correct way to set a default value is to simply pre-fill your ng-model property with the value selected from your ng-options , angular does the rest. Essentially when you define the $scope property your select will bind to assign it the default value from your data array.

How do ng-options work?

Definition and Usage. The ng-options directive fills a <select> element with <options>. The ng-options directive uses an array to fill the dropdown list. In many cases it would be easier to use the ng-repeat directive, but you have more flexibility when using the ng-options directive.

What is Ng selected?

Definition and Usage The ng-selected directive sets the selected attribute of an <option> element in a <select> list. The option will be selected if the expression inside the ng-selected attribute returns true. The ng-selected directive is necessary to be able to shift the value between true and false .

What is Ng option?

The ng-options Directive in AngularJS is used to build and bind HTML elements with options to a model property. It is used to specify <options> in a <select> list. It is designed specifically to populate the items on a dropdown list. This directive implements an array, in order to fill the dropdown list.


1 Answers

This will do the work for you:

<select size="3" ng-model="item" ng-options="s.name for s in itemlist">     <option value="">Select Option</option> </select> 
like image 174
geniuscarrier Avatar answered Sep 30 '22 10:09

geniuscarrier