I would like to filter my view with a simple link. I have several objects which all contain a date. Eg. If I click March only data with "Startdate" March should be displayed. I searched the web but found nothing which worked for me. This is my json object and the criteria should be "Startdate".
trips.son
[{
"Startdate": "Thu Jan 02 2014 00:00:00 +0100",
"DAYS": [{
"DATE": "Thu Jan 02 2014 00:00:00 +0100",
"IATA": "TXL",
"DUTY": "6:10"
}]
}, {
"Startdate": "Sun Jan 05 2014 00:00:00 +0100",
"DAYS": [{
"DATE": "Sun Jan 05 2014 00:00:00 +0100",
"IATA": "CBTH",
"DUTY": "8:07"
}]
}, {
"Startdate": "Wed Sep 24 2014 00:00:00 +0200",
"DAYS": [{
"DATE": "Wed Sep 24 2014 00:00:00 +0200",
"IATA": "BCN",
"DUTY": "9:35"
}, {
"DATE": "Thu Sep 25 2014 00:00:00 +0200",
"IATA": "BCN",
"DUTY": "15:34"
}]
}, {
"Startdate": "Sat Sep 27 2014 00:00:00 +0200",
"DAYS": [{
"DATE": "Sat Sep 27 2014 00:00:00 +0200",
"IATA": "CPH",
"DUTY": "4:44"
}]
}]
Here you can see what I mean:
UPDATED: plnkr
By default only January should by displayed - changing the view when each link is clicked !
I found a way which works for me ! Maybe not the best but it will do the job.
Added StartdateMonth as the name of the month to my scope:
var date = new Date($scope.trips[i].Startdate);
$scope.trips[i].Startdate = date;
var names = ["Januar", "Februar", "März", "April", "Mai", "Juni", "Juli", "August", "September", "Oktober", "November", "Dezember"];
$scope.trips[i].StartdateMonth = names[date.getMonth()];
create ng-click for tab:
<li role="presentation"><a ng-click="myFilter = {StartdateMonth: 'Januar'}">Januar</a></li>
<li role="presentation"><a ng-click="myFilter = {StartdateMonth: 'Februar'}">Februar</a></li>
finally add the filter:
<div ng-repeat="trip in trips | filter: myFilter">