【问题标题】:How to sort a dynamic select list in AngularJS如何在AngularJS中对动态选择列表进行排序
【发布时间】:2017-01-21 07:20:16
【问题描述】:

我在 AngularJS 单页应用程序中有一个页面,它通过读取有关表结构的元数据来显示来自我的数据库中多个表的数据。当字段查找外键时,它会自动创建一个选择下拉列表。一切正常,除了我无法让列表按名称排序。它按通常是 int 类型的主键 ID 字段排序。下面是在模型中加载选项列表的控制器脚本和显示选择控件并尝试对项目进行排序的视图脚本。您能告诉我如何重做此操作以使其正常工作吗?我也尝试过在 orderBy 子句中使用和不使用单引号,并尝试在 orderby 子句中使用 toString(),但没有任何效果。

// controller script
var responseData = responseFK.data;
angular.forEach(responseData, function (item)
{
    columnOptions = columnOptions.concat({ "ID": item[columnNameFK], "Name": item[columnNameFK_Name] });
});
column.COLUMN_OPTIONS = columnOptions;

// view script
<select ng-switch-when="select" ng-options="item.ID as item.Name for item in x.COLUMN_OPTIONS | orderBy: 'item.Name'" ng-model="x.COLUMN_VALUE" ng-required="x.REQUIRED" required></select>
&lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.10/angular.min.js"&gt;&lt;/script&gt;

【问题讨论】:

  • 尝试使用orderBy:'Name',只是一个没有item的属性名。
  • 你应该只写代码和数据数组并选择加载它,然后我们可以具体分析和测试它。
  • orderBy: 'item.Name' 应该是 orderBy: 'Name'
  • 我们在第一条评论中就有了获胜者。 Ali Baig(和 jbrown)做对了。我刚试了一下,它奏效了。很简单。谢谢。我的清单现在看起来很不错!

标签: angularjs


【解决方案1】:

尝试使用 orderBy: 'Name',只是一个没有项目的属性名称。所以你的视图脚本现在应该是:

<select ng-switch-when="select" ng-options="item.ID as item.Name for item in x.COLUMN_OPTIONS | orderBy: 'Name'" ng-model="x.COLUMN_VALUE" ng-required="x.REQUIRED" required></select>

【讨论】:

    猜你喜欢
    • 2015-02-25
    • 2015-09-13
    • 1970-01-01
    • 1970-01-01
    • 2015-06-30
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-04-09
    相关资源
    最近更新 更多