简体   繁体   English

根据Angular JS中对象数组内的数组长度排序

[英]Sort based on array length within array of objects in Angular JS

Consider the following example, 考虑以下示例,

var arrayOfObject = [
{name: 'ron', data: [1,3,5]},
{name: 'raj', data: [2,3]},
{name: 'roy', data: [1]}
]

In the view, I need to sort the objects in ascending order based on the length of data array in each objects. 在视图中,我需要根据每个对象中data数组的长度以升序对对象进行排序。

In the above example roy, raj, ron. 在上面的示例中,roy,raj,ron。

I could always loop through the array, find the length and sort it, But was wondering if there was a way to sort it using Angular's OrderBy Filter (view or controller). 我总是可以遍历数组,找到长度并对其进行排序,但是想知道是否有一种使用Angular的OrderBy筛选器 (视图或控制器)对其进行排序的方法。

Thanks, 谢谢,

Yes your can use angular's OrderBy filter . 是的,您可以使用angular的OrderBy过滤器

In view: 鉴于:

<div ng-repeat="item in arrayOfObject | orderBy:'data.length'">

Or in controller: 或在控制器中:

var ordered = $filter("orderBy")(arrayOfObject, "data.length");

See this jsfiddle 看到这个jsfiddle

<div ng-repeat="item in array| orderBy:'data.length'>

这里orderBy接受data属性

We can use orderby clause 我们可以使用orderby子句

For Ascending 升序

<div ng-repeat="item in arrayOfObject | orderBy:'data.length'">
    {{item.name}}:{{item.data.length}}
  </div>

For Descending order we need to use '-' sign (inside single quotes) 对于降序,我们需要使用“-”号(在单引号内)

<div ng-repeat="item in arrayOfObject | orderBy:'-data.length'">
    {{item.name}}:{{item.data.length}}
  </div>

Try this 尝试这个

  <div ng-repeat="item in arrayOfObject | orderBy:'data.length'">
    {{item.name}}:{{item.data.length}}
  </div>

 var app = angular.module("app", []); app.controller("ctrl", function($scope) { $scope.arrayOfObject = [{ name: 'ron', data: [1, 3, 5] }, { name: 'raj', data: [2, 3] }, { name: 'roy', data: [1] } ]; }); 
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app="app" ng-controller="ctrl"> ASEC: <div ng-repeat="item in arrayOfObject | orderBy:'data.length'"> {{item.name}}:{{item.data.length}} </div> <br/> DESC: <div ng-repeat="item in arrayOfObject | orderBy:-'data.length'"> {{item.name}}:{{item.data.length}} </div> </div> 

Try the following: 请尝试以下操作:

 var myApp = angular.module('myApp', []); myApp.controller('myController', ['$scope', '$filter', function($scope, $filter){ var arrayOfObject = [ {name: 'ron', data: [1,3,5]}, {name: 'raj', data: [2,3]}, {name: 'roy', data: [1]} ] $scope.arrayOfObject = $filter("orderBy")(arrayOfObject, 'data.length'); console.log($scope.arrayOfObject); }]); 
 <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> <div ng-app='myApp' ng-controller='myController'> </div> 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM