标签: angularjs-orderby

在Angular中有多个字段

如何在角度中同时使用多个字段进行排序?按组分组,然后按分组示例

$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

371
推荐指数
5
解决办法
17万
查看次数

Angularjs在orderBy之后错误$ index

我是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中订购之前,这很好用.如果遗漏了重要的东西,请现在就告诉我.

谢谢!

sorting indexing angularjs angularjs-orderby

90
推荐指数
3
解决办法
4万
查看次数

如何在AngularJS中对ng-repeat中的对象数据源进行排序?

假设我有以下用户:

$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.

angularjs angularjs-ng-repeat angularjs-orderby

48
推荐指数
2
解决办法
5万
查看次数

命令不使用ng-repeat上的dict语法

我正在尝试使用ng-repeat和字典样式语法并对键值应用顺序.

(key, value) in something | orderBy:'key'

似乎OrderBy没有按预期工作

这里的例子 http://jsfiddle.net/mhXuW/

javascript angularjs angularjs-orderby

39
推荐指数
3
解决办法
3万
查看次数

orderBy没有按预期工作:Angularjs

我的阵列是: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:nameorderBy:item[name].什么都行不通.为什么这不起作用,是什么代码正确?

javascript angularjs angularjs-orderby

30
推荐指数
1
解决办法
3万
查看次数

在编辑列表时禁用AngularJS中的orderBy

orderBy在我的输入框列表中应用后,如果我编辑任何字段,它立即开始排序,我松散焦点.我尝试挖掘角度代码并发现他们在orderBy的属性上应用了类似于$ watch的东西,因此每当值更改时,它会对列表进行排序.是否有任何方法可以在编辑时禁用orderBy?我不想让orderBy在编辑文本时对数据进行排序.任何帮助将不胜感激

这是我的傻瓜

注意:我想使用orderBy并且不需要任何替代方法,例如从任何控制器本身对列表进行排序.我只是希望orderBy在页面加载时对列表进行一次排序,然后保持相当.

angularjs angularjs-orderby

16
推荐指数
2
解决办法
7993
查看次数

在ng-repeat中使用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)

angularjs angularjs-orderby

16
推荐指数
2
解决办法
2万
查看次数

AngularJS分页顺序仅影响显示的页面

任何人都可以指出我正确的方向找出一种方法来解决分页和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)

javascript paging angularjs angularjs-orderby

11
推荐指数
1
解决办法
1万
查看次数

日期未在Angular.js中正确排序

我对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)

sorting date angularjs angularjs-orderby

10
推荐指数
1
解决办法
1万
查看次数

OrderBy Date值,它们只是Angular JS中的字符串

我试图按日期订购一些数据,虽然日期只是字符串,格式为dd-mm-yyyy.

我做了一个过滤器,它转换了普通的数字字符串(在美国的日期格式,我想要英国日期格式),例如01272012到27-01-2014,但当我尝试订购它时,它仍然只看到它们数字字符串,所以01-01-1990将在02-01-2014之前出现.

有关如何在过滤器中执行此操作的任何建议?

谢谢!

更新

我发现如果日期格式为yyyy-mm-dd,日期会自动排序.然后我用来orderBy:['date']订购数据,只在显示数据时使用我的原始过滤器.

我最终不得不撤消我的数据,显示最近的日期.为了达到这个目的,我-在我的订单中添加了一个声明:orderBy:['-date'].

javascript date angularjs angularjs-orderby

8
推荐指数
1
解决办法
1万
查看次数