Question

我正在尝试使用AngularJS实现一个简单的日期比较器。基本上，我将有一个包含dateStart和dateExpire字段的优惠券列表。我希望通过将用户输入searchStartDate和searchExpireDate与优惠券本身的dateStart和dateExpire进行比较来筛选此列表。我现在在控制器中拥有的是：

    $scope.startDateFilter = function (coupon) {

        var filteredList = [];
        var searchStartDay = new Date().getDate();
        var searchStartMonth = new Date().getMonth();
        var searchStartYear = new Date().getYear();
        var startDate = new Date(coupon.dateStart).getDate();
        var startMonth = new Date(coupon.dateStart).getMonth();
        var startYear = new Date(coupon.dateStart).getYear();

        if (searchStartDay <= startDate && searchStartMonth <= startMonth && searchStartYear <= startYear)
            filteredList.push(coupon);

        if (searchStartMonth < startMonth && searchStartYear <= startYear)
            filteredList.push(coupon);

        if (searchStartYear < startYear)
            filteredList.push(coupon);

        return filteredList;
    }

这个块是我的自定义过滤器，用于比较startDate和用户输入searchStartDate。但是，这对我不起作用。

我的观点是：

 <tbody data-ng-repeat="coupon in activeList = (couponList | filter: {name: searchParent} | filter: startDateFilter) " data-ng-switch on="couponCollapse[$index]">

有谁知道我为什么会遇到这个问题？

Answer 1

您可以使用纯日期比较，因为您已有一个有效的日期对象。试试这个。

$scope.startDateFilter = function (coupon) {

        var filteredList = [];
        var searchStartDate = new Date();
        var startDate = new Date(coupon.dateStart);

        if (searchStartDate < startDate)
            filteredList.push(coupon);

        return filteredList;
    }

Answer 2

这是plunker。只要您使用<input type="date"/>，就可以使用标准比较，例如==，=＆gt;等。

自定义过滤器：

app.filter('dateRangeFilter', function() {
  return function(coupons, from, to) {
    var result = [];

    for (var i = 0; i < coupons.length; i++) {
      if(coupons[i].startDate >= from && coupons[i].endDate <= to)
        result.push(coupons[i]);
    }

    return result;
  };
})

用法：

<body ng-controller="MainCtrl">
  Start Date:
  <input ng-model="sd" type="date" />
  <br/>End Date:
  <input ng-model="ed" type="date" />
  <br/>

  <ul>
    <li ng-repeat="coupon in coupons | dateRangeFilter:sd:ed">
      {{ coupon.startDate | date:'MM-dd-yyyy'}} to {{ coupon.endDate | date: 'MM-dd-yyyy' }}
    </li>
  </ul>
</body>

Angular JS简单日期比较器

2 个答案: