Question

我正在尝试应用价格过滤器ng-repeat。目前，该代码仅针对完全匹配过滤价格;我需要它过滤以包含具有该价格的每个位置。

我的html如下所示

  <select id="maxPrice" ng-model="searchPrice" class="filterSelect">
      <option selected="">Max Price</option>
      <option>Free</option>
      <option>$1,000</option>
      <option>$2,000</option>
      <option>$3,000</option>
      <option>$5,000</option>
      <option>$8,000</option>
      <option>$13,000</option>
      <option>$21,000</option>
      <option>$34,000 </option>
    </select>

<div ng-repeat="school in diffSchools | filter:{Cost:searchPrice}" class="item">
  <p class="title">{{school.campName}}</p>
</div>

目前，这会过滤学校只返回数字的完全匹配。它正在搜索的对象如下所示：

{
    "campName": "Camp1",
    "Cost": ["$2,500-$12,000"],
}

如何过滤以包含以下所有内容，包括所选期权的价格？

我已经检查了以下几个堆栈溢出问题，它们讨论filtering using a fixed number（在一个实例中为0）或quite different from my problem，特别是对于非专家角度用户。

Answer 1

添加过滤器来执行此操作，例如：

$scope.costBetween = function(item){
    var Cost = item.Cost[0].split("-"), 
    min = priceToInt(Cost[0]),
    max = priceToInt(Cost[1]);
    return $scope.searchPrice > min && $scope.searchPrice < max
};

<div ng-repeat="school in diffSchools | filter: costBetween" class="item">
    <p class="title">{{school.campName}}</p>
</div>

<强> Demo

使用角度过滤器查找价格低于选择期权金额的所有位置

1 个答案: