Question

我有以下对象数组：

$scope.monthTasks = [object,object,...,object];

每个对象如下：

Object={
"emp_id": 1,
"task_id":212,
"project_id":2,
"task_name":"Updating UI",
"tasks": [
            {
             "task_date": "2016-9-14",
             "hours": 2,
             "minutes": 15
            }
        ]
    };
}

我有多个具有不同task_date的此类对象。我想按日期对这些对象进行分组，因为几个任务可以具有相同的日期。我怎样才能做到这一点？

Answer 1

使用过滤器a。 orderBy过滤器可用于它。您可以像使用orderBy：task_date一样使用它。像这里：

 {{ [{
    'name': 'Ari',
    'status': 'awake'
    }, {
    'name': 'Q',
    'status': 'sleeping'
    }, {
    'name': 'Nate',
    'status': 'awake'
 }] | orderBy: 'name' }}

<!--
    [
    {"name":"Ari","status":"awake"},
    {"name":"Nate","status":"awake"},
    {"name":"Q","status":"sleeping"}
    ]
-->

Answer 2

这不是一种简单的方法，但我会创建一个字典，其键为task_date 我假设每个对象可能有多个任务，这使问题更加复杂所以我的解决方案如下：

http://codepen.io/kei-sato/pen/qaLRLZ

JS：

var app = angular.module('myApp', []);

app.controller('myCtrl', ['$scope', function($scope){
  var monthTasks = [
    { id: 1, tasks: [{ task_date: '2016-9-13' }, { task_date: '2016-9-14' }] },
    { id: 2, tasks: [{ task_date: '2016-9-12' }] },
    { id: 3, tasks: [{ task_date: '2016-9-11' }, { task_date: '2016-9-14' }] },
    { id: 4, tasks: [{ task_date: '2016-9-10' }] },
  ];

  var monthTasksDict = monthTasks.reduce((dict, monthTask) => {
    monthTask.tasks.forEach(task => {
      var taskDate = task.task_date;
      dict[taskDate] = dict[taskDate] || [];
      dict[taskDate].push(monthTask);
    });
    return dict;
  }, {});

  var monthTasksWithTaskDate = Object.keys(monthTasksDict).map(taskDate => ({ task_date: taskDate, monthTasks: monthTasksDict[taskDate] }));
  $scope.monthTasksWithTaskDate = monthTasksWithTaskDate;

}]);

HTML：

<html lang="en" ng-app="myApp">
  <body ng-controller="myCtrl">
    <ul ng-repeat="monthTasks in monthTasksWithTaskDate | orderBy: 'task_date'">
      task_date: {{ task_date }}
      <li ng-repeat="monthTask in monthTasks">
        id: {{ monthTask.id }}
      </li>
    </ul>

    <!-- External Libraries -->
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
  </body>
</html>

Answer 3

您可以使用功能过滤结果

var inputs = $('input');

inputs.filter(function(i,el){
return inputs.not(this).filter(function() {
    return this.value === el.value;
}).length !== 0;
}).addClass('red');

功能

<div ng-repeat="task in tasksToFilter() | filter:filterTask">
        <b>{{task['tasks'][0]['task_date']}}</b>
        <li ng-repeat="mytask in result(task)">{{mytask.task_name}}</li>        
  </div>

<强> FULL EXAMPLE

Angular JS分组对象

3 个答案: