排列$ scope中对象的顺序

彼得·布姆斯玛

我想知道是否可以更改范围内对象的顺序。我有一个$scope.movies现在该作用域是按ID排序的。因此，当我控制台日志时，$scope.movies它看起来像这样，

{"id":1,"title":"The Town","release_date":"2010-10-21","image":"/zX4fKmDXKGt4hlzhAJirdlRKFgO.jpg","user_id":null,"created_at":"2015-12-04T19:57:58.449Z","updated_at":"2015-12-04T19:57:58.449Z","movie_id":"23168","imdb_rating":"7.6"},
{"id":2,"title":"Interstellar","release_date":"2014-11-06","image":"/nBNZadXqJSdt05SHLqgT0HuC5Gm.jpg","user_id":null,"created_at":"2015-12-04T19:58:16.600Z","updated_at":"2015-12-04T19:58:16.600Z","movie_id":"157336","imdb_rating":"8.7"},
{"id":3,"title":"Django Unchained","release_date":"2013-01-16","image":"/5WJnxuw41sddupf8cwOxYftuvJG.jpg","user_id":null,"created_at":"2015-12-04T20:00:22.411Z","updated_at":"2015-12-04T20:00:22.411Z","movie_id":"68718","imdb_rating":"8.5"},
{"id":4,"title":"Moonrise Kingdom","release_date":"2012-05-30","image":"/uw88gWDC0W7AAEhMeQmtdXFV7yR.jpg","user_id":null,"created_at":"2015-12-04T20:00:41.054Z","updated_at":"2015-12-04T20:00:41.054Z","movie_id":"83666","imdb_rating":"7.8"},
{"id":5,"title":"Gone Girl","release_date":"2014-10-01","image":"/gdiLTof3rbPDAmPaCf4g6op46bj.jpg","user_id":null,"created_at":"2015-12-05T09:05:08.424Z","updated_at":"2015-12-05T09:05:08.424Z","movie_id":"210577","imdb_rating":"8.2"}

但是我想按发布日期排列数据，所以看起来像这样，

{"id":1,"title":"The Town","release_date":"2010-10-21","image":"/zX4fKmDXKGt4hlzhAJirdlRKFgO.jpg","user_id":null,"created_at":"2015-12-04T19:57:58.449Z","updated_at":"2015-12-04T19:57:58.449Z","movie_id":"23168","imdb_rating":"7.6"},
{"id":4,"title":"Moonrise Kingdom","release_date":"2012-05-30","image":"/uw88gWDC0W7AAEhMeQmtdXFV7yR.jpg","user_id":null,"created_at":"2015-12-04T20:00:41.054Z","updated_at":"2015-12-04T20:00:41.054Z","movie_id":"83666","imdb_rating":"7.8"},
{"id":3,"title":"Django Unchained","release_date":"2013-01-16","image":"/5WJnxuw41sddupf8cwOxYftuvJG.jpg","user_id":null,"created_at":"2015-12-04T20:00:22.411Z","updated_at":"2015-12-04T20:00:22.411Z","movie_id":"68718","imdb_rating":"8.5"},
{"id":5,"title":"Gone Girl","release_date":"2014-10-01","image":"/gdiLTof3rbPDAmPaCf4g6op46bj.jpg","user_id":null,"created_at":"2015-12-05T09:05:08.424Z","updated_at":"2015-12-05T09:05:08.424Z","movie_id":"210577","imdb_rating":"8.2"}
{"id":2,"title":"Interstellar","release_date":"2014-11-06","image":"/nBNZadXqJSdt05SHLqgT0HuC5Gm.jpg","user_id":null,"created_at":"2015-12-04T19:58:16.600Z","updated_at":"2015-12-04T19:58:16.600Z","movie_id":"157336","imdb_rating":"8.7"},

那么可以使用JavaScript更改$ scope中对象的顺序吗？

我orderBy release_date在ng-repeat中使用。但是对于我的html结构，我不得不将电影分成几行。使用这个，

$scope.toRows = function(arr, total){
  var i = 0, rows = [];
  while(i < arr.length){
    i % total == 0 && rows.push([]);
    rows[rows.length-1].push(arr[i++])
  }
  return rows
};
$scope.moviesRows = $scope.toRows($scope.movies, 6);

然后，它们将orderBy无法正常工作，因为它将行的第一项$scope.movies放在行中，然后在行中orderBy的对象上进行了处理。因此，它首先按ID的顺序将所有对象放在行中，然后按release_date的顺序对对象进行排序。

* 编辑 *

可以看出，JSON输出的顺序与Angular放置对象的方式无关。

array.sort(function(a,b){
  return new Date(b.release_date) - new Date(a.release_date);
});

在对象以及控制台中按发布日期排序。但是Angular仍然按ID放置对象。

Vi100

您可以使用orderBy过滤器来实现所需的功能。看看：https：//docs.angularjs.org/api/ng/filter/orderBy

无论如何，如果您进行了很多集合操作，那么最好查看一下几个不错的库中的一个，例如UnderscoreJS，Lodash等。

我使用Lodash，但这只是一个偏爱。

根据其他要求：

您必须先将数组排序为块，然后在控制器上注入$ filter并执行以下操作：

var orderBy = $filter('orderBy');
$scope.orderedMovies = orderBy($scope.movies, "release_date", false);
$scope.moviesRows = $scope.toRows($scope.orderedMovies, 6);

本文收集自互联网，转载请注明来源。

如有侵权，请联系 [email protected] 删除。