オブジェクト角度JSグルーピングは、私は、オブジェクトの次の配列が持つ
Object={
"emp_id": 1,
"task_id":212,
"project_id":2,
"task_name":"Updating UI",
"tasks": [
{
"task_date": "2016-9-14",
"hours": 2,
"minutes": 15
}
]
};
}
Iが異なるtask_dateとを有する複数のそのようなオブジェクトがあります。いくつかのタスクが同じ日付を持つことができるので、これらのオブジェクトを日付でグループ化したいと思います。どうすればこれを達成できますか？
は、これは、このような簡単な方法はありませんが、私はそのキー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>
フィルタ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"}
]
-->
あなたはあなたの結果
<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>
機能
$scope.tasksToFilter = function() {
CachedTasks = [];
return $scope.json;
}
$scope.filterTask = function(task) {
var newTask = CachedTasks.indexOf(task["tasks"][0]["task_date"]) == -1;
if (newTask) {
CachedTasks.push(task["tasks"][0]["task_date"]);
console.log(CachedTasks);
}
return newTask;
}
$scope.result = function(currenttask)
{
var groupvalues = [];
for(var i=0;i<$scope.json.length;i++)
{
if($scope.json[i]['tasks'][0]['task_date'] == currenttask['tasks'][0]['task_date'])
{
groupvalues.push($scope.json[i]);
}
}
return groupvalues;
}
あなたはHTMLßで一緒にそれらを表示しますか – HermanTheGermanHesse