如何在角度中同时使用多个字段进行排序?按组分组,然后按分组示例
$scope.divisions = [{'group':1,'sub':1}, {'group':2,'sub':10}, {'group':1,'sub':2},{'group':1,'sub':20},{'group':2,'sub':1},
{'group':2,'sub':11}];
Run Code Online (Sandbox Code Playgroud)
我希望将其显示为
1 - 1
1 - 2
1 - 20
2 - 1
2 - 10
2 - 11
<select ng-model="divs" ng-options="(d.group+' - '+d.sub) for d in divisions | orderBy:'group' | orderBy:'sub'" />
Run Code Online (Sandbox Code Playgroud) javascript sorting angularjs angularjs-ng-repeat angularjs-orderby
我是Angular.js的新手,在排序数组和处理排序数据时遇到了一些问题.
我有一个包含项目的列表,并希望按"Store.storeName"排序,这是迄今为止的工作.但在排序数据后,我的删除功能不再起作用了.我认为这是因为排序后$ index是错误的,所以删除了错误的数据.
我怎么解决这个问题?订购范围中的数据而不是视图中的数据?怎么做?
这是一些相关的代码:
在视图中:
<tr ng-repeat="item in items | orderBy:'Store.storeName'">
<td><input class="toggle" type="checkbox" ng-model="item.Completed"></td>
<td>{{item.Name}}</td>
<td>{{item.Quantity}} Stk.</td>
<td>{{item.Price || 0 | number:2}} €</td>
<td>{{item.Quantity*item.Price|| 0 | number:2}} €</td>
<td>{{item.Store.storeName}}</td>
<td><a><img src="img/delete.png" ng-click="removeItem($index)">{{$index}}</a></td>
</tr>
Run Code Online (Sandbox Code Playgroud)
在我的控制器中我有这个删除功能,它应该删除特定的数据:
$scope.removeItem = function(index){
$scope.items.splice(index,1);
}
Run Code Online (Sandbox Code Playgroud)
在View中订购之前,这很好用.如果遗漏了重要的东西,请现在就告诉我.
谢谢!
假设我有以下用户:
$scope.users = {
"2": {
email: 'john@gmail.com',
name: 'John'
},
"3": {
email: 'elisa@gmail.com',
name: 'Elisa'
}
}
Run Code Online (Sandbox Code Playgroud)
我想<select>用以下选项创建一个:
<option value="3">Elisa</option>
<option value="2">John</option>
Run Code Online (Sandbox Code Playgroud)
换句话说,用户应按名称排序.
我尝试了以下使用(key, value) in expression语法,但它不起作用:
<option ng-repeat="(user_id, user) in users | orderBy:'user.name'"
value="{{ user.id }}">
{{ user.name }}
</option>
Run Code Online (Sandbox Code Playgroud)
我错过了什么?
请不要ng-options使用与我ui-select2不相容的解决方案ng-options.
我正在尝试使用ng-repeat和字典样式语法并对键值应用顺序.
(key, value) in something | orderBy:'key'
似乎OrderBy没有按预期工作
我的阵列是:BS.其结构是:
Array[317]
0: Object
$$hashKey: "022"
name: "Los Angeles Comm."
.
.
.
..
Run Code Online (Sandbox Code Playgroud)
BS是一个数组.每个值都是带有名称字段的JSon对象.
我想根据他们的名字对BS的所有值进行排序.我在尝试 :
<option ng-repeat="item in BS | orderBy:item.name" value="{{item.name}}">{{item.name}}</option>
Run Code Online (Sandbox Code Playgroud)
我也尝试过:orderBy:name和orderBy:item[name].什么都行不通.为什么这不起作用,是什么代码正确?
orderBy在我的输入框列表中应用后,如果我编辑任何字段,它立即开始排序,我松散焦点.我尝试挖掘角度代码并发现他们在orderBy的属性上应用了类似于$ watch的东西,因此每当值更改时,它会对列表进行排序.是否有任何方法可以在编辑时禁用orderBy?我不想让orderBy在编辑文本时对数据进行排序.任何帮助将不胜感激
注意:我想使用orderBy并且不需要任何替代方法,例如从任何控制器本身对列表进行排序.我只是希望orderBy在页面加载时对列表进行一次排序,然后保持相当.
我有这样的对象:
students = {name: 'Aa_Student', class: 'A_Class'},
{name: 'Ab_Student', class: 'A_Class'},
{name: 'Ac_Student', class: 'B_Class'},
{name: 'Ba_Student', class: 'B_Class'},
{name: 'Bb_Student', class: 'C_Class'},
{name: 'Bc_Student', class: 'C_Class'}
Run Code Online (Sandbox Code Playgroud)
假设学生对象被洗牌了.我使用ng-repeat来显示数据.我想按自定义顺序对对象进行排序.
例如,我想显示如下数据:
Name Class
-----------------------------
Ac_Student B_Class
Ba_Student B_Class
Aa_Student A_Class
Ab_Student A_Class
Bb_Student C_Class
Bc_Student C_Class
Run Code Online (Sandbox Code Playgroud)
所以基本上,我想按学生的班级排序,但它首先是B_Class,然后是A_Class,然后是C_Class.另外,我想按字母顺序按学生姓名订购.我怎样才能做到这一点?
HTML:
<table>
<tr ng-repeat="student in students | orderBy:customOrder">
...
</tr>
</table>
Run Code Online (Sandbox Code Playgroud)
控制器:
$scope.customOrder = function(student) {
$scope.students = $filter('orderBy')(student, function() {
});
};
Run Code Online (Sandbox Code Playgroud) 任何人都可以指出我正确的方向找出一种方法来解决分页和orderBy在Angular中一起工作的方式吗?
目前,我可以orderBy并分页data []的结果,但orderBy过滤器只会单独影响每个页面.
例如,如果我按ID按相反顺序排序,则第1页将列出10-1,而第2页将列出15-11,而不是从15开始并在第二页结尾处转到1.
我在这里有一个基本的小提琴http://jsfiddle.net/ZbMsR/
这是我的控制器:
function MyCtrl($scope) {
$scope.currentPage = 0;
$scope.pageSize = 10;
$scope.orderBy = "-appId";
$scope.data = [
{'appId': 1}, {'appId': 2}, {'appId': 3}, {'appId': 4}, {'appId': 5}, {'appId': 6}, {'appId': 7}, {'appId': 8}, {'appId': 9},{'appId': 10}, {'appId': 11}, {'appId': 12}, {'appId': 13}, {'appId': 14}, {'appId': 15}
];
$scope.numberOfPages=function(){
return Math.ceil($scope.data.length/$scope.pageSize);
};
}
//We already have a limitTo filter built-in to angular,
//let's make a startFrom filter
app.filter('startFrom', function() {
return function(input, start) {
start = …Run Code Online (Sandbox Code Playgroud) 我对Angular.js比较新,我遇到日期排序问题.我已经浏览了网络上的类似问题,但没有找到任何相同的味道.
情况如下:
我从数据库中获取数据集(我希望在列标题可排序表中显示),其中每个记录包含格式化为字符串的日期:
data = [
{
"name": "Test_1_Test",
"creation_date": "8/2/2013 10:31:02 AM"
},
{
"name": "Test_2_Test",
"creation_date": "8/1/2013 9:12:32 AM"
},
{
"name": "Test_3_Test",
"creation_date": "9/13/2013 4:55:09 AM"
}
]
Run Code Online (Sandbox Code Playgroud)
另外,我回到了一组列标题:
headers = [
{
"column": "name",
"label": "Doc Name"
},
{
"column": "creation_date",
"label": "Create Date",
"displayFormat": {
"dateType": "medium"
}
}
]
Run Code Online (Sandbox Code Playgroud)
使用ng-repeat指令创建列标题(没有麻烦):
<th ng-repeat="column in smartviewColumns">
<a href="" ng-click="sortBy($index)">
{{column.label}}
</a>
</th>
Run Code Online (Sandbox Code Playgroud)
其中控制器中的sortBy函数如下:
$scope.sortBy = function(index){
if ($scope.sortColumn && $scope.sortColumn === $scope.columns[index]) {
$scope.reverse = !$scope.reverse; …Run Code Online (Sandbox Code Playgroud) 我试图按日期订购一些数据,虽然日期只是字符串,格式为dd-mm-yyyy.
我做了一个过滤器,它转换了普通的数字字符串(在美国的日期格式,我想要英国日期格式),例如01272012到27-01-2014,但当我尝试订购它时,它仍然只看到它们数字字符串,所以01-01-1990将在02-01-2014之前出现.
有关如何在过滤器中执行此操作的任何建议?
谢谢!
更新
我发现如果日期格式为yyyy-mm-dd,日期会自动排序.然后我用来orderBy:['date']订购数据,只在显示数据时使用我的原始过滤器.
我最终不得不撤消我的数据,显示最近的日期.为了达到这个目的,我-在我的订单中添加了一个声明:orderBy:['-date'].