使用daterange根据开始日期和结束日期过滤AngularJS项目?

时间:2016-05-26 10:23:56

标签: angularjs meanjs

大家好我想使用meanjs app中的日期范围功能过滤enquiry_received_date的项目(来自和迄今为止)。然后我尝试了很多方法但无法得到解决方案,如果有人知道解决方案,请帮助我..... my plunk

控制器:

.filter('dateRange', function() {
    return function(records, from, to) {
        return records.filter(function(record) {
            return record.Date >= from && record.Date <= to;
        });
    }
})

HTML

<td> {{data.buyer_name}}</td>
   <td> {{data.ex_india_date}}</td>
      <td> {{data.quantity}}</td>
        <td> {{data.enquiry_received_date}}</td>

My plunk

1 个答案:

答案 0 :(得分:0)

首先,您的记录似乎没有像Date这样的字段,因此您的过滤无效。我看到您正在显示enquiry_received_date,所以我猜这是您要用于过滤的字段。此字段包含格式为YYYY-MM-DD的日期,因此您需要将其解析为日期。我建议使用MomentJS - 这个库使得使用日期对象非常容易。

以下是可用于实现此目的的代码:

<强>控制器

.filter('dateRange', function() {
        return function(records, from, to) {
            return records.filter(function(record) {
                return !moment(record.enquiry_received_date, 'YYYY-MM-DD').isBefore(moment(from))
                && !moment(record.enquiry_received_date, 'YYYY-MM-DD').isAfter(moment(to));
            });
        }

查看

在视图中我刚添加了对moment.js的引用。

Working Plunker

http://plnkr.co/edit/gEPtj9yk1AxgEZiNeqY0?p=preview

<强> 修改

如果您想使您的过滤器更具可重用性,您可以添加另一个参数,其中包含应该用于过滤的字段名称:

<强>控制器

.filter('dateRange', function() {
        return function(records, dateKey, from, to) {
            return records.filter(function(record) {
                return !moment(record[dateKey], 'YYYY-MM-DD').isBefore(moment(from))
                && !moment(record[dateKey], 'YYYY-MM-DD').isAfter(moment(to));
            });
        }

查看

<tr ng-repeat="data in  record | dateRange : 'enquiry_received_date' : from : to">
    <td> {{data.buyer_name}}</td>
    <td> {{data.ex_india_date}}</td>
    <td> {{data.quantity}}</td>
    <td> {{data.enquiry_received_date}}</td>
</tr>

<强> Plunker

http://plnkr.co/edit/pczikllV7vBTVoFfcpvK?p=preview