Фильтрация результатов в режиме реального времени с помощью AngularJS и MomentJS

У меня есть результаты листинга 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 загружается только при перезагрузке страницы, а не в режиме реального времени.

Любые входы?


person Eric Mitjans    schedule 23.10.2014    source источник


Ответы (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 "
person David Votrubec    schedule 23.10.2014