ng-options和ng-select都属于angluar里的作用在表格或者下拉菜单的标签。
ng-options的值可以是一个内涵表达式（comprehension expression），其实这只是一种有趣的说法，简单来 说就是它可以接收一个数组或者对象，并对她们进行循环，将内部的内容提供给select标签内部的选项。 ng-select 它可以帮助你通过数据模型来创建select元素.它很好的支持了select标签的语法。
而ng-options、ng-select如何使用呢？
ng-options：
ng-options 指令用于使用<option>填充<select>选项。
ng-options属性可以在表达式中使用数组或对象来自动生成一个select中的option列表。ng-options与 ng-repeat很相似，很多时候可以用ng-repeat来代替ng-options。但是ng-options提供了一些好处，例如减少内存提高速度，以及提供选择框的选项来让用户选择。
ng-select：
ng-select用来将数据同HTML的select标签进行绑定。这个指令可以 和ng-model以及ng-options指令一起使用，构建精细且表现良好的动态表单。 ng-select 它可以帮助你通过数据模型来创建select元素.它很好的支持了select标签的语法, 而ng-options用在selectd上面
使用np-options和ng-select都会碰到一些问题，比如：ng-option表达式的写法？
1、数组作为数据源
用数组中的值做标签。(label for value in array)
用数组中的值作为选中的标签。(select as label for value in array)
用数组中的值做标签组。(label group by group for value in array)
用数组中的值作为选中的标签组。(select as label group by group for value in array track by trackexpr)
2、对象作为数据源
用对象的键-值（key-value）做标签。(label for (key , value) in object)
用对象的键-值作为选中的标签。(select as label for (key , value) in object)
用对象的键-值作为标签组。(label group by group for (key, value) in object)
用对象的键-值作为选中的标签组。(select as label group by group for (key, value) in ob)
也许这样看会有点累，我们举个例子：
<select ng-model="myOption" ng-options="value.id as value.label group by value.group for value in myOptions">
<option>--</option>
</select>
ng-model的值会指向select元素的当前选中项的value值. ng-options指令会用于填充select下拉选项,它的值还需要深究一下: 我们从右边往左边看会比较容易,首先是:value in myOptions。
它表示你要迭代当前作用域下的myOptions对象. 迭代时,myOptions对象里的每一项的名字就叫value.接下来是:group by value.group，它告诉angular.js去创建这个标签:
<optgroup label="value.group">
...........................
<optgroup>
标签的label属性将会被value的group属性值填充.
最后是: value.id as value.label
value.id将会和模型进行绑定,它的值会被存进ng-model属性里去(也就是option的value值,被选中后就是select标签的value). 如果你没有写value.id as,而是只写了value.label,那么,整个对象会被作为ng-model的值.
value.label就是option元素的选项名.这段代码渲染的结果如下:
<optgroup label="Group 1">
<option value="0">Item 1</option>
<option value="1">ltem 2</option>
</optgroup>
注意一下options的value属性: 你可能认为它的值应该是数据模型中的id属性值,但事实并非如此(虽然一开始我也这么认为).事实上,它是一个递增的数字,这个数字指向的是模型的索引值(这里的模型就是myOptions数组).不用担心它-当用户选择某一项的时候,正确的id还是会被选中,并且传递到ng-model属性中去.另外,如果你的ng-options表达式里没有value.id部分,那选中项对应的整个对象会成为ng-model的值.
同时，也可以试试以不同方法为数据源的option是如何显示的，按照不同的形式去写会有完全不一样的显示布局效果，这是angular里比较重要的知识点。
最后就是我们一般使用它们会碰到的一个问题，angularJS的ng-model绑定到select上，会自动增加一个value为空的option,这是为什么呢？
原因：ng-model没有初始化导致的， 如果ng-model所绑定的变量的值在ng-options绑定的value里面有， 下拉选框中就不会有空白的一项，选中别的数据项以后消失； 如果ng-model所绑定的变量的值不在ng-options绑定的value里面， 下拉选框中就不会有空白一项,并且只有当ng-options绑定的value里有对应 的text为空行时，这个空行才会一直存在于下拉选项里。
解决办法
方法一：将select中的一个option设置为空，就可以防止因添加ng-model自动添加空option的问题
方法二：自己预先添加一个value为空的option，再用ng-if="false"把它去掉。
-----------------------------------------------------------------------------------------------------------------------
IT修真院
