ng-options 是 AngularJS 中快速產生 option 的方法,而且 ng-options 使用上非常靈活,因此在不同狀況下使用方法都會有所差異
資料物件
4 | side_dish: 'Corn Soup' , |
16 | side_dish: 'Black Tea' , |
1.label for value in array
基本下拉選單
2 | < select ng-model = "selectLunch" ng-options = "lunch.name for lunch in lunches" > |
3 | < option value = "" >請選擇</ option > |
自訂下拉選單
1 | < select ng-model = "selectLunch" ng-options = "(lunch.name + ' (' + lunch.side_dish + ')') for lunch in lunches" > |
2 | < option value = "" >請選擇</ option > |
自訂 value
1 | < select ng-model = "selectLunch" ng-options = "lunch.name for lunch in lunches track by lunch.price" > |
2 | < option value = "" >請選擇</ option > |
2.label group by group for value in array
加入 optgroup 分類
2 | < select ng-model = "selectLunch" ng-options = "lunch.name group by lunch.category for lunch in lunches track by lunch.price" > |
3 | < option value = "" >請選擇</ option > |