Angular JS选项下拉菜单

达米安

我想知道AngularJS ng-options-下拉列表中的名称可以使用2个不同的变量吗?

以这个简化的示例为例-我希望下拉列表中包含国家/地区-城市。我知道这很简单,但这可能与在select下拉列表之外组合变量有关吗?

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.5/angular.min.js"></script>
</head>

<body ng-app="myapp">
<div ng-controller="HelloController" >

<select ng-model="blah" ng-options="city.Id as city.CityName for city in cities"></select>
</div>
<script>
angular.module("myapp", [])
    .controller("HelloController", function($scope) {
        $scope.cities = [
   {Id: '000001', Country:'USA', CityName: 'Chicago'},
   {Id: '000002', Country:'Ireland', CityName: 'Dublin'},
   {Id: '000003', Country:'Spain', CityName: 'Barcelona'},
   {Id: '000004', Country:'USA', CityName: 'Boston'},
];

    } );
</script>
</body>
</html>
约翰

您应该能够像这样完成此操作:

ng-options="city.Id as (city.Country + ' - '  + city.CityName) for city in cities"

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

Angular JS-自动聚焦输入并显示typeahead下拉菜单-ui.bootstrap.typeahead

来自分类Dev

如何同时更改两个select>选项下拉菜单

来自分类Dev

使用JavaScript动态生成的选择选项下拉菜单

来自分类Dev

Angular JS订单无法使用下拉菜单

来自分类Dev

在Angular JS中取消选中复选框时如何禁用下拉菜单

来自分类Dev

Angular.js奇怪的行为-必须单击两次按钮才能显示下拉菜单

来自分类Dev

Angular.js,无法从数据库返回的json对象设置下拉菜单

来自分类Dev

Angular指令中的Bootstrap下拉菜单

来自分类Dev

如何将所选项目从angular-ui下拉菜单发送回角度控制器

来自分类Dev

根据表格内容创建选择选项下拉菜单

来自分类Dev

用于多个选择选项下拉菜单的本地存储

来自分类Dev

禁用Angular uib下拉菜单中的菜单项

来自分类Dev

在Angular JS的动态下拉菜单中选择默认值

来自分类Dev

如何在Angular中组合两个下拉菜单时隐藏下拉菜单中的特定选项

来自分类Dev

使用JavaScript动态生成的选择选项下拉菜单

来自分类Dev

使用选项下拉菜单BatmanJS过滤数据获取的渲染视图

来自分类Dev

使用c#的webdriver-如何在选项下拉菜单中进行迭代?

来自分类Dev

如何在下拉菜单的标题选项下将菜单选项居中?

来自分类Dev

如何在Angular Directive中使用选择选项下拉菜单?

来自分类Dev

在HTML选择选项下拉菜单中添加输入功能

来自分类Dev

jQuery获取选定选项下拉菜单的文本

来自分类Dev

Angularjs-Angular UI Grid:是否可以通过rowentity值动态过滤下拉菜单选项?

来自分类Dev

重新显示原始下拉选项下方的HTML中的相同下拉菜单?

来自分类Dev

Angular JS上的Angular JS添加选项下拉菜单无法正常工作

来自分类Dev

Angular 4 嵌套下拉菜单

来自分类Dev

Bootstrap 下拉菜单需要带有 Angular 2 项目的 Popper.js

来自分类Dev

如何在angular js中使用下拉菜单自定义过滤器

来自分类Dev

如何使用 Angular 中的反应形式获取选择选项下拉文本值

来自分类Dev

Angular 自动分配下拉菜单

Related 相关文章

  1. 1

    Angular JS-自动聚焦输入并显示typeahead下拉菜单-ui.bootstrap.typeahead

  2. 2

    如何同时更改两个select>选项下拉菜单

  3. 3

    使用JavaScript动态生成的选择选项下拉菜单

  4. 4

    Angular JS订单无法使用下拉菜单

  5. 5

    在Angular JS中取消选中复选框时如何禁用下拉菜单

  6. 6

    Angular.js奇怪的行为-必须单击两次按钮才能显示下拉菜单

  7. 7

    Angular.js,无法从数据库返回的json对象设置下拉菜单

  8. 8

    Angular指令中的Bootstrap下拉菜单

  9. 9

    如何将所选项目从angular-ui下拉菜单发送回角度控制器

  10. 10

    根据表格内容创建选择选项下拉菜单

  11. 11

    用于多个选择选项下拉菜单的本地存储

  12. 12

    禁用Angular uib下拉菜单中的菜单项

  13. 13

    在Angular JS的动态下拉菜单中选择默认值

  14. 14

    如何在Angular中组合两个下拉菜单时隐藏下拉菜单中的特定选项

  15. 15

    使用JavaScript动态生成的选择选项下拉菜单

  16. 16

    使用选项下拉菜单BatmanJS过滤数据获取的渲染视图

  17. 17

    使用c#的webdriver-如何在选项下拉菜单中进行迭代?

  18. 18

    如何在下拉菜单的标题选项下将菜单选项居中?

  19. 19

    如何在Angular Directive中使用选择选项下拉菜单?

  20. 20

    在HTML选择选项下拉菜单中添加输入功能

  21. 21

    jQuery获取选定选项下拉菜单的文本

  22. 22

    Angularjs-Angular UI Grid:是否可以通过rowentity值动态过滤下拉菜单选项?

  23. 23

    重新显示原始下拉选项下方的HTML中的相同下拉菜单?

  24. 24

    Angular JS上的Angular JS添加选项下拉菜单无法正常工作

  25. 25

    Angular 4 嵌套下拉菜单

  26. 26

    Bootstrap 下拉菜单需要带有 Angular 2 项目的 Popper.js

  27. 27

    如何在angular js中使用下拉菜单自定义过滤器

  28. 28

    如何使用 Angular 中的反应形式获取选择选项下拉文本值

  29. 29

    Angular 自动分配下拉菜单

热门标签

归档