日期范围过滤器不起作用答案

【问题标题】：Date range filter not working日期范围过滤器不起作用
【发布时间】：2017-11-09 02:58:30
【问题描述】：

我似乎无法使这个日期范围filter 工作？当我选择一个日期时，它似乎会触发但它没有在var filter 中推送任何内容

我已经解决了这个问题好几个小时了，但它无济于事。

html

<div class="form-group">
   <input type="date" class="form-control" ng-model="from">
</div>
<div class="form-group">
   <input type="date" class="form-control" ng-model="to">
</div>

ng-重复

<tr ng-repeat="attendance in displayedCollection | dateRange:from:to ">
 <td>{{ attendance.day | date: 'EEEE, MMM d'}}</td>
 <td>{{ attendance.timeIn | date:'h:mm a' }}</td>
 <td>{{ attendance.timeOut | date:'h:mm a'}}</td>
 <td class="text-capitalize">
 <i class="fa fa-map-marker" aria-hidden="true"></i> {{ attendance.details }}</td>
 <td>{{ attendance.totalHrs | date:'hh:mm'}} </td>
</tr>

控制器

.filter('dateRange', function () {
  return function (product, fromDate, toDate) {
    var filtered = [];

    if (!fromDate && !toDate) {
      return product;
    }

    var from_date = Date.parse(fromDate);
    var to_date = Date.parse(toDate);

    angular.forEach(product, function (item) {
      if (item.day > from_date && item.day < to_date) {
        filtered.push(item); //not pushing anything
      }
    });
    return filtered; // returning nothing
  };
})

编辑：

显示的收集数据

[{
    "_id": "5a03bed5c349e82fa4937430",
    "details": "MHQ Lucena Branch 2",
    "fullName": "Priz almarinez",
    "timeIn": "2017-11-09T02:34:57.000Z",
    "attendance": "admin11-09-2017",
    "day": "2017-11-08T16:00:00.000Z",
    "user": "admin",
    "__v": 0,
    "status": "Pending",
    "check": false
},
{
    "_id": "5a03c4e61bebc52c0737a426",
    "details": "MHQ Lucena Branch 2",
    "fullName": "Priz almarinez",
    "timeIn": "2017-11-09T02:34:57.000Z",
    "attendance": "admin11-09-2017",
    "day": "2017-11-09T16:00:00.000Z",
    "user": "admin",
    "__v": 0,
    "status": "Pending",
    "check": false
},
{
    "_id": "5a03c4ec1bebc52c0737a427",
    "details": "MHQ Lucena Branch 2",
    "fullName": "Priz almarinez",
    "timeIn": "2017-11-09T02:34:57.000Z",
    "attendance": "admin11-09-2017",
    "day": "2017-11-10T16:00:00.000Z",
    "user": "admin",
    "__v": 0,
    "status": "Pending",
    "check": false
}]

谢谢

【问题讨论】：

你试过调试吗？即使是一些console.log 电话也会有所帮助
item.day是什么数据类型？
@Phil item.day 是我尝试记录 from_date 和 to_date 的日期，似乎是正确的。
但它是字符串还是日期对象？创建一个重现问题的演示。您还验证了Date.parse() 返回的内容吗？
@charlietfl 我已经编辑了我的帖子。

标签： javascript angularjs filter

【解决方案1】：

您当前正在将您的 item.day TimeString ("2017-11-10T16:00:00.000Z") 与解析的日期 Integer 进行比较。在你的 forEach 循环中解析 item.day 并进行比较。按预期工作。这是一个工作示例的链接https://codepen.io/pablo-tavarez/pen/pdRvjW?editors=0010

【讨论】：

它现在可以工作，但为什么显示的Collection.length 没有改变？
因为原来的displayedCollection仍然完好无损。过滤器创建了一个副本并过滤了该副本。这是您寻求的答案的链接。 stackoverflow.com/questions/15316363/…