问题标签 [ng-options]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
809 浏览

angularjs - 有什么方法可以自定义 ng-options 为下拉菜单创建的空白选项?

所以不管你信不信,我想要并且很高兴在下拉菜单上创建一个空白选项,但我想做更多。

我想告诉 Angular 在创建空白选项时使用我选择的字符串。例如,我希望它在它创建的空白选项中说“-select-”而不是空字符串。问题是我喜欢一旦做出选择就无法使用空白选项的方式。虽然将对象添加到我绑定到的数组中并不是什么大不了的事,但它开始需要额外的下拉代码代码来模仿 ng-options 已经给我们提供的行为。这没什么大不了的,但是当必须为大量下拉菜单完成时,它会变得艰巨和令人沮丧。

有谁知道是否有办法告诉 ng-options 在与 ng-model 值不匹配时显示什么?如果有就好了。

0 投票
2 回答
7235 浏览

angularjs - 从服务返回数据时的默认 angularjs ng-option

到目前为止,我所看到的正常解决方案都没有奏效。我的控制器从服务返回选项列表并填充选择元素没有任何问题,但我无法设置默认值。最接近我的返回错误:Cannot read property '0' of undefinedwith the code $scope.new_account.account_type = $scope.new_account.account_type[0];。有了这个错误,我认为对象还没有准备好,所以我使用了一个解析来返回我的服务数据。

但这以及类似的解决方案没有任何影响。选择元素被填充,但默认选项为空白。我宁愿设置一个默认选项,而不是使用带有值的“请选择”默认?值。

我也试过

通过 $scope 和 ng-init 的各种实现...

有什么想法可以帮助为此设置默认值吗?

根据要求,accountTypes 返回[{"id":1, "name":"General"}, {"id":2, "name":"Super"}, {"id":3, "name":"Trial"}

0 投票
1 回答
734 浏览

angularjs - 使用 ng-repeat 字段 + 选择选项 + $http.get 构建的 angularjs 表单

我有这样的代码:

为什么角度选择不能像魅力一样工作?感谢您的帮助

0 投票
2 回答
1472 浏览

angularjs - ng-options 预定义选项对象

看看我的例子 http://plnkr.co/edit/21ewxVIaRm4IHyF3TgoD?p=preview

我需要将选项对象存储为 ng-model 所以我用于 ng-optionsng-options="m as m.name for m in list"

但是,如果我手动将 ng-model 设置为对象,默认情况下它不会在下拉列表中选择正确的选项。它正确存储数据,但如果使用此表达式,它只会预先选择一个选项,ng-options="m.name as m.name for m in list"但这会将字符串存储在模型上而不是选项对象上。

我做错了什么吗?

目标:

  • 将 ng-model 设置为默认选项对象,并在下拉列表中自动选择它。
0 投票
1 回答
5687 浏览

javascript - 如果第二个不为空,则 Ng-options 下拉连接字段

我有一个表用户,每个用户都有一个用户名,但表中还有一个可以为空的显示名。我想在下拉列表中显示所有用户及其用户名,如果可用,还显示他们的显示名。

因此,没有显示名称的用户将显示为:

具有显示名称的用户将类似于:

我当前的选择只是一个常规的角度 ng-options 选择。

我不知道如何使用 ng-options 解决这个问题,我到处搜索,但找不到。任何帮助,将不胜感激!

0 投票
1 回答
9180 浏览

angularjs - 从单个 JSON 文件动态创建多个下拉列表 angularjs

我有一个 categoryTypes 列表,每个 categoryType 都有一个类别列表,我在一个下拉列表中显示它们,用户可以从中选择多个项目,所做的选择将过滤视图中显示的应用程序(这是一个内部应用商店)

这是我正在使用的 JSON 文件。

[{"type":"category","id":1181,"categoryType":{"id":1180,"name":"Technology"},"name":"Spotfire"},{"type": "category","id":1182,"categoryType":{"id":1180,"name":"Technology"},"name":"PipelinP"},{"type":"category","id ":1184,"categoryType":{"id":1183,"name":"Category"},"name":"IBSI"},{"type":"category","id":1185,"categoryType ":{"id":1183,"name":"Category"},"name":"Clin"},{"type":"category","id":1187,"categoryType":{"id" :1186,"名称":"Capability"},"name":"Chemistry"},{"type":"category","id":1188,"categoryType":{"id":1183,"name":"Category"},"name ":"关键意见领袖"},{"type":"category","id":1189,"categoryType":{"id":1183,"name":"Category"},"name":"Pnts "},{"type":"category","id":1190,"categoryType":{"id":1183,"name":"Category"},"name":"CI"},{"type ":"category","id":1191,"categoryType":{"id":1180,"name":"Technology"},"name":"VantageP"},{"type":"category", “身份证”:1192,"categoryType":{"id":1183,"name":"Category"},"name":"Targets"},{"type":"category","id":1193,"categoryType":{" id":1186,"name":"能力"},"name":"信息科学"},{"type":"category","id":1194,"categoryType":{"id":1186, "name":"Capability"},"name":"DMP"},{"type":"category","id":1195,"categoryType":{"id":1180,"name":"技术"},"name":"Spotfire Web Player"},{"type":"category","id":1196,"categoryType":{"id":1186,"name":"Capability"},"name":"PredictiveS"},{"type":"category","id":1198,"categoryType":{"id":1197,"name":"Function"},"name":"PharmD" },{"type":"category","id":1199,"categoryType":{"id":1197,"name":"Function"},"name":"iM - CV/GI"}, {"type":"category","id":1200,"categoryType":{"id":1180,"name":"Technology"},"name":"Mobile Apps"},{"type": "category","id":1201,"categoryType":{"id":1197,"name":"Function"},"name":"RAPIDE"},{"type":"category","id ":1202,"categoryType":{"id":1197,"name":"Function"},"name":"iM - Oncology"},{"type":"category","id":1203,"categoryType":{"id" :1186,"name":"能力"},"name":"Clin"}]

但是因为管理员可以将 categoryTypes 和类别添加到任何类型,所以需要动态创建下拉列表,因为它们是硬编码的。每个类别类型都需要有一个新的下拉列表。

所以我能做的就是将所有类别显示在一个下拉列表中,按类别类型分组;

我创建了工厂来获取类别;

控制器看起来像这样;

因此,以 JSON 的第一行为例。

'Spotfire' 的类别在 categoryType 'Technology' 中。

所以对于那个categorytype,我需要技术的下拉列表,它至少显示spotfire +在那个categoryType的JSON文件中解析的任何其他内容。

然后是下一个 categoryType 的另一个下拉列表,依此类推。

0 投票
2 回答
913 浏览

javascript - AngularStrap Select 和 ng-options 不能很好地使用动态数组

我正在使用 AngularJS 和 AngularStrap(指令 Select,基于 Silvio Moreto 制作的 Bootstrap-Select)。我有下一个问题:

我有很多汽车品牌。使用 ng-options,我将它们像选项一样放在选择中。换句话说,当我选择一个选项(汽车品牌)时,我会得到这个汽车品牌的不同型号,并将它们显示为另一个选择中的选项。

问题是当我使用 AngularStrap 指令选择时,它不能很好地工作。我第一次选择一个汽车品牌,它工作正常,但下一个选择的选项(汽车品牌),它显示选择的汽车品牌的型号和选择的前一个汽车品牌的第一个型号。

当我不使用 AngularStrap 选择时,它运行良好,因此我认为问题出在 AngularStrap 选择中。

谢谢你的帮助。

我的代码是下一个:

HTML:

控制器(JS):

0 投票
1 回答
2925 浏览

javascript - 使用 angularjs 中的指令在下拉列表中选择一个选项

我是 angularjs 的新手,正在努力指示下拉菜单,但在选择初始值时遇到问题。我必须将要选择的选项的 ID 作为属性传递给指令。我在一个范围变量中设置属性值,然后在 ng-Init 中使用它。

这是我的指令代码:

代码在打字稿中。这是HTML:

如果我硬编码 dataSel 的值,即 ng-init="dataSel=3" 那么它工作正常但是当我设置为范围变量时它就不起作用了。那么我该如何解决这个问题。

编辑 解决。我已经相应地更新了代码。

0 投票
1 回答
57348 浏览

angularjs - 带有对象数据源的 ng-options

我很难理解 ng-options 如何与数据源一起工作。我已经阅读了文档,我觉得我正在做所需要的,但我在尝试时仍然遇到问题。

我总是在控制台中收到此错误:

错误:

'选择(作为标签)形式的预期ngOptions ?对于(,)?收藏价值(由expr跟踪)?但得到'k as v for(k, v) in types'。

我做错了什么?

在此处查看 plunkr:

http://plnkr.co/edit/Bl6u4151KyDkxhYrsdCm?p=preview

0 投票
1 回答
285 浏览

javascript - 遇到问题 - 在 AngularJS 中,选择框默认值选择并将新字段添加到现有模型

堆栈:AngularJS 1.2

我面临的问题是将选择框选择为服务器为 JSON 中的 order.status 字段传递的默认值(“已发货”)-


控制器: https
://gist.github.com/pawank/8079603 HTML: https ://gist.github.com/pawank/8079624

问题 1:如何使 ID 为“selectedStatus”的选择框设置为默认值“Shipped”?

问题 2save_order_edit_form() :单击“保存更改”时,“order.comment”没有从 HTML 函数中传递给控制器

任何帮助表示赞赏。

谢谢,