ng-options中的键值对

我需要使用关联数组作为使用AngularJS的select选项的数据源。

是否有可能使用这样的数组?

{ "key1": "val1", "key2": "val2", "key3": "val3", ... } 

并得到这样的东西:

 <select> <option value="key1">val1</option> <option value="key2">val2</option> <option value="key3">val3</option> ... </select> 

我阅读文档 ,但我不明白如何实现这一点。

3 Solutions collect form web for “ng-options中的键值对”

使用ng-option

 <select ng-model="blah" ng-options="key as value for (key , value) in data"></select> 

或者使用ng-repeat

 <select> <option ng-repeat="(key, value) in data" value="{{key}}">{{value}}</option> </select> 

控制器中的数据:

 $scope.data = { "key1": "val1", "key2": "val2", "key3": "val3", ... }; 

下面的文章讨论了你可以使用ngOptions的各种方法(迄今为止我见过的最清晰,最彻底的解释): http : //www.undefinednull.com/2014/08/11/a-brief-walk -通过的最-NG选项function于angularjs /

Lin-Tsu Lin回答实际上提供了访问对象的两种方式。 只是想添加更多的行 –

因为ng-repeat指令为数组中的每个项目重复一段HTML代码,所以它可以用来在下拉列表中创build选项,但是ng-options指令特别用于填充选项的下拉列表,并且在至less一个重要的优点:

使用ng-options进行的下拉菜单允许选定的值为一个对象,而由ng-repeat下拉菜单必须是一个string。

为参考添加一个示例:

ng-repeat : http : //www.w3schools.com/angular/tryit.asp? ng-repeat = try_ng_select_repeat_selected

ng-options : http : //www.w3schools.com/angular/tryit.asp? ng-options =try_ng_select_object

有关完整的参考资料,请前往http://www.w3schools.com/angular/angular_select.asp

  • MySQLselect与CASE或IF ELSEIF语句? 不知道如何得到结果
  • 如何禁用CSS或JavaScript文本select?
  • Linq:Select和Where有什么区别?
  • 如何从IGrouping获取值
  • 是否有在Sublime Text,Atom中的光标下select单词的快捷方式
  • 为什么有些文本框不接受Control +默认情况下select全部的快捷方式
  • 如何从表格中select所有列,再加上像ROWNUM这样的其他列?
  • 什么是默认的MySQL JOIN行为,INNER或OUTER?
  • JavaScript吸pipe(告诉鼠标光标下像素的颜色)
  • select除MySQL之外的所有列?
  • 如何禁用文本select突出显示使用CSS?