角度数组基于到期日期删除

时间:2016-09-21 21:12:43

标签: javascript angularjs drop-down-menu

我有一个需要进行某些验证的表单。我有两个显示相同数据的下拉菜单(在这种情况下是具有到期日期的促销代码)..

所以我的第一个下拉列表是促销代码:

<div class="input-group col-sm-12 col-md-12 col-lg-12">
     <span style="min-width: 150px;" class="input-group-addon promo-select">Select Promo Code</span>
     <select id="offer_promo" name="offer_promo" class="form-control" ng-change="promoAction()"
                    ng-model="promo"
                    ng-options="p.Promo_ID as p.Promo_Code + ' ( ' + p.Promo_Description + ' )' for p in promos">
         <option value="">Please Select A Promotion</option>
     </select>
</div>

所以我的第二个下拉列表是附加促销代码:

<div data-ng-show="(offer.is_primary === 1)" class="input-group col-sm-12 col-md-12 col-lg-12">
      <span class="input-group-addon">Additional Code</span>
      <select ng-disabled="additionalCodeDisabled" id="offer_promo_add" name="offer_promo_add" class="form-control" ng-model="addPromo"
                    ng-options="p.Promo_Code as p.Promo_Code + ' ( ' + p.Promo_Description + ' )' for p in addPromos"></select>
</div>

这是我在promoAction中调用的过滤器控制器:

$scope.promoFilter = function() {
  function promosFilteredBy(date) {
    var filteredPromos = $scope.addPromos.filter(function(addPromos) {
      console.log(filteredPromos);
      var promoDate = new Date($scope.promo_expiration);
      return promoDate < date;
    });
    return filteredPromos;
  }

  var selectedPromoDate = new Date($scope.promo_expiration);
  $scope.addPromos = promosFilteredBy(selectedPromoDate);
};

在我的控制器中,我正在返回一个空白数组或未定义filterPromos。所以过滤功能没有正常运行,我不知道我错过了哪里。

我的问题出现在用户在第一个下拉列表中选择促销代码时,它根据您选择的内容有一定的到期代码。所以我想删除额外促销代码中的所有代码,即高于第二个下拉列表。我不能使用.slice(),因为它们不是按时间顺序排列的。我使用momment.js作为我的日期,因此可能希望使用.isBefore()来比较日期。

所以我给你举个例子,我在第一个下拉列表中选择promo_code“25ANC” promo_expiration:“01/30/2017”。现在,应该从下拉列表中删除超过该日期的附加促销下拉菜单中的任何内容。

我目前有一个$ watch功能正在观看促销和addPromo的ng-model。我知道我需要创建一个函数,它将进入并切片不符合日期验证的促销代码。但是我该如何创建该函数以及应该在哪里专门调用该函数?

如果我遗漏了代码的任何部分,请告诉我,我可以提供。

2 个答案:

答案 0 :(得分:1)

您肯定希望绑定到ng-change功能,但可能只在您的第一个下拉列表中(从第一个下拉列表中选择b / c是过滤促销活动的触发器)第二次下拉)。

Here is a plunker

ng-options更改为p而非p.Promo_ID会将完整的促销对象绑定到ng-model,这意味着我们可以使用{访问所选的促销截止日期{1}}并将其他促销日期与之比较。

您会注意到第二个下拉列表绑定到范围变量$scope.promo.Promo_EXP,该变量在additionalPromos中创建,基本上只是一个已过滤的数组,有效的&#34;促销(也就是那些日期小于您在第一个下拉列表中选择的日期)。

我没有看到你的完整实施,所以它可能不适合100%,但希望它有所帮助。

答案 1 :(得分:0)

所以我想出了一个修复来比较两个使用momentjs。我浏览了促销,然后返回过滤器提供的内容,并将其作为addPromos。

end