How to filter the data by Future and Past Dates

Question

HI, I am new to angular, I want to show data by past data from yesterday's date, and show data of today+future date.

//Here is the HTML code for Past Events
<div ng-repeat="event in events | filter:pastDate">
<p>{{event.name}}
<div>

//Here is the HTML code for Future Events
<div ng-repeat="event in events | filter:futureDate">
<p>{{event.name}}
<div>

Each event has a Start Date and End Date, Can anyone please explain how to achieve this.

If greater than today then FutureDate else if smaller than today then PastDate. — Hardik Vaghani, Nov 22 '16 at 05:37
@Kranthi can you give some more information about your question, like what is the structure of the event object etc.? — sreeramu, Nov 22 '16 at 05:44
Hope this helps: http://stackoverflow.com/questions/25515431/ng-repeat-filtering-data-by-date-range — Cruzer, Nov 22 '16 at 05:46
@sreeramu event_name, event_info, event_startdate,event_enddate — Kranthi, Nov 22 '16 at 06:14
@Kranthi this example may help you : http://jsfiddle.net/154f9az8/ — sreeramu, Nov 22 '16 at 07:10

Slava Utesinov · Answer 1 · 2016-11-22T06:04:23.530

Try this

var myApp = angular.module('app', []);
myApp.controller('TestController', ['$scope', function($scope) {
    var d = new Date();        
    d.setDate(d.getDate() - 1);
    $scope.events = [{date:new Date}, {date: new Date()},{date: d}];     
    prepareDate = function() {
      var date = new Date();
      date.setHours(0);
      date.setMinutes(0);
      date.setSeconds(0);
      return date;
    }  
    $scope.pastDate = function(actual){
      return actual.date < prepareDate();        
    }
    $scope.futureDate = function(actual){
      return actual.date >= prepareDate();        
    }
}]);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<body ng-app="app">
  <div ng-controller="TestController">
    <h4>Past:</h4>
    <div ng-repeat='event in events | filter : pastDate'>{{event.date| date:'yyyy-MM-dd HH:mm:ss'}}</div>
    <h4>Future:</h4>
    <div ng-repeat='event in events | filter : futureDate'>{{event.date| date:'yyyy-MM-dd HH:mm:ss'}}</div>
</div>
</body>

How to filter the data by Future and Past Dates

1 Answers1