Order post By Date inside ng-repeat in View - angularjs

Question

I am working on an angular app . here i need to show data in date order for user timeline
JS:
$scope.comments = [{"_id":"535e912cc6b93c7b30479454",
"created_at":"2014-04-28 23:04:36",
"post_id":"535e912cc6b93c7b30479453",
"type":"story",
"story":"[{"_id":"535e912cc6b93c7b30479454",
"title":"test story",
"content":"this is my story...",
"created_at":2014-04-30 22:04:36"}]",
"article":"[]"
},
{"_id":"535e912cc6b93c7b30479454",
"created_at":"2014-04-25 23:04:36",
"post_id":"535e912cc6b93c7b30479453",
"type":"article"
"article":"[{"_id":"535e912cc6b93c7b30479454",
"title":"test article",
"content":"this is my article...",
"created_at":2014-04-30 22:04:36"}]",
"story":"[]"
},----
//so on
]
View:
<div ng-repeat = "data in comments">
<div class="time">
<span>{{data.created_at | DateFiltertoIso | date:'MMM-dd-yy'}}
<div>
<div ng-switch-on="data.type">
<div ng-switch-when="story">
//switch layout adn get further story data by post_id
</div>
</div>
<div ng-switch-on="data.type">
<div ng-switch-when="article">
//switch layout adn get further article data by post_id
</div>
</div>
</div>
Expected Output is like
Apr-04-14
post1
post2
/all post for that date
Apr-01-14
post5
post6
//so on
I am getting
Apr-04-2014
post1
Apr-04-2014
post2
Apr-04-2014
post3
I am newbie to angular. Any Help would be helpfull

Answer 1

Try this
Working Demo
Html
<div ng-controller="MyCtrl">
<div ng-repeat="data in flattenedResults">
<div class="time"> <span>
<b>{{data.created_at | badDateToISO | date:'MMM-d-yy'}} </b></span>
<div>
<u ng-show="data.story.length>0">Stories</u>
<div ng-repeat="story in data.story">
{{story.title}}{{story.created_at}}
</div>
<u ng-show="data.article.length>0">Articles</u>
<div ng-repeat="article in data.article">
{{article.title}}
</div>
Script
var myApp = angular.module('myApp', []);
myApp.filter('badDateToISO', function () {
return function (badTime) {
var goodTime = badTime.replace(/(.+) (.+)/, "$1T$2Z");
return goodTime;
};
});
myApp.controller('MyCtrl', function ($scope) {
$scope.flattenedResults = [];
$scope.comments = [{
"_id": "535e912cc6b93c7b30479454",
"created_at": "2014-04-28 23:04:36",
"post_id": "535e912cc6b93c7b30479453",
"type": "story",
"story": [{
"_id": "535e912cc6b93c7b30479454",
"title": "test story 1",
"content": "this is my story... 2",
"created_at": "2014-04-30 22:04:36"
}],
"article": "[]"
}, {
"_id": "535e912cc6b93c7b30479454",
"created_at": "2014-04-28 23:04:36",
"post_id": "535e912cc6b93c7b30479453",
"type": "article",
"article": [{
"_id": "535e912cc6b93c7b30479454",
"title": "test article 33",
"content": "this is my article... 33",
"created_at": "2014-04-30 22:04:36"
}],
"story": "[]"
}, {
"_id": "535e912cc6b93c7b30479454",
"created_at": "2014-04-25 23:04:36",
"post_id": "535e912cc6b93c7b30479453",
"type": "article",
"article": [{
"_id": "535e912cc6b93c7b30479454",
"title": "test article 1",
"content": "this is my article... 1",
"created_at": "2014-04-30 22:04:36"
}],
"story": "[]"
}, {
"_id": "535e912cc6b93c7b30479454",
"created_at": "2014-04-28 23:04:36",
"post_id": "535e912cc6b93c7b30479453",
"type": "story",
"story": [{
"_id": "535e912cc6b93c7b30479454",
"title": "test story 2",
"content": "this is my story... 2",
"created_at": "2014-04-30 22:04:36"
}],
"article": "[]"
}, {
"_id": "535e912cc6b93c7b30479454",
"created_at": "2014-04-25 23:04:36",
"post_id": "535e912cc6b93c7b30479453",
"type": "article",
"article": [{
"_id": "535e912cc6b93c7b30479454",
"title": "test article 2",
"content": "this is my article... 2",
"created_at": "2014-04-30 22:04:36"
}],
"story": "[]"
}];
$scope.jsonFlatten = function () {
$scope.dates = [];
$scope.comments.reduce(function (result, item) {
$scope.dates.push(item.created_at);
}, 0);
$scope.dates = _.uniq($scope.dates);
angular.forEach($scope.dates, function (dateValue, dateKey) {
var obj = {};
obj.created_at = dateValue;
var articleValues = [];
var storyValues = [];
angular.forEach($scope.comments, function (value, key) {
if (dateValue === value.created_at) {
obj._id = value._id;
obj.post_id = value.post_id;
if (value.type === 'story') {
angular.forEach(value.story, function (storyValue, storyKey) {
storyValues.push(storyValue)
});
} else if (value.type === 'article') {
angular.forEach(value.article, function (articleValue, articleKey) {
articleValues.push(articleValue)
});
}
}
});
obj.story = storyValues;
obj.article = articleValues;
$scope.flattenedResults.push(obj);
});
};
$scope.jsonFlatten(); //calling the method jsonFlatten() and making the flatten json
});