angular select用法詳解


  最近在angular中使用select指令時,出現了很多問題,搞得很郁悶。查看了很多資料后,發現select指令並不簡單,決定總結一下。

  select用法:

<select ng-model="" [name=""] [required=""] [ng-required=""] [ng-options=""]>
</select>

  屬性說明:

  發現並沒有ng-change屬性

  ng-required:當屬性值為true時,對select添加required驗證,為false時不驗證。

  ng-options:指定數據源,生成option選項。

 

  數據源為數組時,用法:

   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指定值,否則會出現空白選項。
  


      

  

    

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM