使用 MEAN 堆栈根据日期过滤表数据... AngularJS、MongoDB、Mongoose

Question

我已经使用表单将事件添加到 MondoDB。我正在显示事件列表，但需要按日期过滤所有事件，以便只有将来的事件显示在此表中（我还有另一个表用于过去的事件）。我所有的尝试，下面最好的一个，都没有在我的表中产生任何事件。我认为日期格式或架构与表单中的格式不兼容，但我是菜鸟，所以我知道什么。这里有我认为完整的拼图所需的尽可能多的代码。

架构：

'use strict';

var mongoose = require('mongoose'),
Schema = mongoose.Schema;

var EventSchema = new Schema({
    startDate: { type: Date, required: false }
});

mongoose.model('Event', EventSchema);

表格：

<section data-ng-controller="EventsController">
  <p class="page-title">create a new event</p> 
  <form style="float:none; left:25%" name="eventForm" class="form-horizontal col-md-6" role="form" data-ng-submit="create(eventForm.$valid)" novalidate>
    <div class="form-group" ng-class="{ 'has-error' : submitted && eventForm.date.$invalid }">
      <label for="date" class="col-md-3 control-label">Date</label>
      <div class="col-md-4">
        <input name="date" type="date" id="date" placeholder="mm/dd/yyyy" class="form-control glowing-border" required>
      </div>
    </div>
    <div class="form-group">
      <div class="col-md-offset-3 col-md-9">
        <button type="submit" class="btn btn-default">submit</button>
      </div>
    </div>
  </form>
</section>

我的桌子的重要部分：

<div class="panel panel-default" data-ng-controller="EventsController" data-ng-init="find()">
    <table class="table table-hover table-striped">
        <thead>
        <tr>
            <th>Date</th>
        </tr>
        </thead>
        <tbody>
        <tr data-ng-repeat="event in events | filterList">
            <td>{{event.startDate}}</td>
        </tr>
        </tbody>
    </table>
</div>

带有控制器和自定义过滤器的我的模块：

'use strict';

var app = angular.module('mean.events');
app.controller('EventsController', ['$scope', '$stateParams', '$location', 'Global', 'Events',
  function($scope, $stateParams, $location, Global, Events) {
    $scope.global = Global;

    $scope.create = function(isValid) {
      if (isValid) {
        var event = new Events({
          startDate: this.date
        });
        event.$save(function(response) {
          $location.path('events/' + response._id);
        });

        this.date = '';
      } else {
        $scope.submitted = true;
      }
    };


    $scope.find = function() {
      Events.query(function(events) {
        $scope.events = events;
      });
    };
  }
]);

app.filter('filterList', function() {
  return function(items) {
    var upcoming = [];

    angular.forEach(items, function(item){
      if(item.startDate >= new Date()) {
        upcoming.push(item);
      }
    });

    console.log(upcoming);
    return upcoming;
  };
});

Answer 1

问题确实源于插入数据库的日期与新的 Date() 对象的格式不同。为了解决这个问题，我将 item.startDate 传递给 new Date() 以使它们相同。这是工作过滤器：

app.filter('filterList', function() {
    return function(items) {
        var upcoming = [];

        angular.forEach(items, function(item){
          if ( new Date() > new Date(item.startDate) ) {
              upcoming.push(item);
          }
        });

        return upcoming;
    };
});