CODEWITHSUNDEEP
javascriptangularjsdate-range
Rob
Rob

Reputation: 738

AngularJS DateRange - how to include the end date

I'm using a data range filter on an angular dataset, however it is not 'including' the end date. I have to select +1 day from the date picker for it to work properly. The start date is working fine.

This code is example only and not production...

JAVASCRIPT

// parse a date in dd-mm-yyyy format
function parseDate(input) {
  var parts = input.split('-');
  return new Date(parts[2], parts[1]-1, parts[0]); 
}

nameSpace.filter("rangeFilter", function() {
  return function(items, from, to) {
        var df = parseDate(from);
        var dt = parseDate(to);
        var arrayToReturn = [];        
        for (var i=0; i<items.length; i++){
            var tf = new Date(items[i].date1 * 1000);
            if (tf >= df && tf < dt)  {
                arrayToReturn.push(items[i]);
            }
        }

        return arrayToReturn;
 };
});

HTML

From:<input  ng-model="datef"  type="text" placeholder="" />
To:<input  ng-model="datet"  type="text" placeholder="" />

<tr ng-repeat="order in orders | rangeFilter:datef:datet">
    <td>{{order.date1 * 1000 | date:'dd-MM-yyyy'}}</td>
</tr>

SCOPE / CONTROLLER

nameSpace.controller('MyController', function MyController($scope) {
  $scope.datef = "27-05-2010"
  $scope.datet = "29-07-2015";
  $scope.orders = [
  {
    "date1": 1306281600
  },
  {
    "date1": 1196467200
  },
  {
    "date1": 1406505600
  },
  {
    "date1": 1406592000
  }]
});

Upvotes: 0

Views: 86

Answers (1)

Tommaso Sebastianelli
Tommaso Sebastianelli

Reputation: 193

I think you're not passing the "to" parameter correctly. As the official Documentation says(https://docs.angularjs.org/api/ng/filter/filter), the returning function of each filter accept 3 params like this: return function(array, expression, comparator){...} To pass both "from" and "to" parameters, you should pass them to the function using an object:

HTML

From:<input  ng-model="datef"  type="text" placeholder="" />
To:<input  ng-model="datet"  type="text" placeholder="" />

<tr ng-repeat="order in orders | rangeFilterr:{from: datef, to: datet}">
<td>{{order.date1 * 1000 | date:'dd-MM-yyyy'}}</td>
</tr>

JAVASCRIPT

// parse a date in dd-mm-yyyy format
function parseDate(input) {
  var parts = input.split('-');
  return new Date(parts[2], parts[1]-1, parts[0]); 
}

nameSpace.filter("rangeFilter", function() {
  return function(items, obj) {
        var df = parseDate(obj.from);
        var dt = parseDate(obj.to);
        var arrayToReturn = [];        
        for (var i=0; i<items.length; i++){
            var tf = new Date(items[i].date1 * 1000);
            if (tf >= df && tf < dt)  {
                arrayToReturn.push(items[i]);
            }
        }

        return arrayToReturn;
 };
});

Upvotes: 0

Related Questions