使用 AngularJS 和 MomentJS 实时过滤结果答案

【问题标题】：Filtering results in real time with AngularJS and MomentJS使用 AngularJS 和 MomentJS 实时过滤结果
【发布时间】：2014-10-23 10:56:13
【问题描述】：

我有一个 ng-repeat 列表结果，但我的目标是只显示包含今天日期的元素。

我当前的设置可以做到，但需要重新加载页面来重新定义时间变量并过滤结果。

老实说，我不确定这样的实时过滤器（00.00 时列表自动变为空）是否可以完成，所以如果您能对此问题有所了解，我将不胜感激。

这是我目前的布局：

   <div class="row msf-row" 
     ng-repeat="record in recordlist | filter: search | filter: record.date = dateJson " 
     ng-class="{ 'msf-cancelled': record.cancelled}">
      <div class="col-md-1">{{record.date}}</div>
      <div class="col-md-1"><strong>{{record.car}}</strong></div>
      <div class="col-md-2">{{record.driver}}</div>
      <div class="col-md-2">{{record.from}}</div> 
   </div>

以及相关的JS：

 $scope.dateJson = moment().format("YYYY MM DD");
 $scope.addRecord = function () {
    $scope.recordlist.push(
            {
                date: $scope.dateJson, 
                car: $scope.carList.code, 
                driver: $scope.driverList.name,
                from: $scope.locationList.place,
                destination: $scope.locationList2.place, 
                pax: $scope.paxList
            }
        );
   jsonToRecordLocalStorage($scope.recordlist);
};

所以基本上，过滤器将 $scope.dateJson 与对象属性 record.date 进行比较并过滤结果，但当然 date.Json 仅在页面重新加载时加载，而不是实时加载。

任何输入？

【问题讨论】：

标签： javascript angularjs momentjs

【解决方案1】：

您可以像这里http://davidjs.com/2014/02/how-to-call-any-function-as-a-filter-in-angularjs/一样定义自己的过滤器功能

这个过滤器函数看起来像这样

    $scope.filterRecordsByDate = function(record) {
     var date = moment(); 
     //reset to midnight
     date.set('hours', 0).set('minutes', 0).set('seconds', 0);

     //you might need to reset to midnight also the property 'record.date'
     return record.date == date;
    }

然后在你的 HTML 中

ng-repeat="record in recordlist | filter: search | filter: filterRecordsByDate "

【讨论】：