最近在angular中使用select指令時,出現了不少問題,搞得很鬱悶。查看了不少資料後,發現select指令並不簡單,決定總結一下。數組
select用法:ui
<select ng-model="" [name=""] [required=""] [ng-required=""] [ng-options=""]>
</select>
屬性說明:spa
發現並無ng-change屬性code
ng-required:當屬性值爲true時,對select添加required驗證,爲false時不驗證。對象
ng-options:指定數據源,生成option選項。blog
數據源爲數組時,用法:字符串
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 groupexpr for value in array track by trackexpr
數據源爲對象時,用法:
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 groupexpr for (key,value)in object track by trackexpr
具體說明:
array/object:數組/對象
label:option選項顯示的名稱。
select:是選中某一項後,綁定到ngModel的值。
value : 數組中的值。
(key,value):對象的key,value。
group by groupexpr:用於選項分組,
ng-options與ng-repeat自動生成option選項的區別:
ng-options生成的option選項選中後,綁定到ngModel的值能夠是對象。ng-repeat綁定到ngModel的值只能是字符串。
注意:select初始化時須要爲ngModel指定值,不然會出現空白選項。