为什么我的自定义过滤器谓词过滤器不起作用

时间:2016-01-07 18:06:15

标签: angularjs filter angular-material

我有一个用例,我必须根据两个下拉列表中的选择过滤数组。两个选项都来自md-select(来自Angular材料),因此两个选择都是一个数组。原始数组中与选择数组中的任何记录匹配的任何记录都应由过滤器返回。

我已经返回了以下逻辑,但我无法弄清楚为什么我的数据不会被过滤。

$scope.filterTasks = function (t, i, array) {
  if ($scope.filter.tradeDir.length === 0 && $scope.filter.cluster.length === 0) {
    return true;
  }
  else if ($scope.filter.tradeDir.length !== 0 && $scope.filter.cluster.length === 0) {
    $scope.filter.tradeDir.forEach(function (td) {
      if ((t.Trade.code === td.trade.code) && (t.Direction.code === td.direction.code)) {
        return true;
      }
    });
  } else if ($scope.filter.cluster.length !== 0 && $scope.filter.tradeDir.length !== 0) {
    $scope.filter.tradeDir.forEach(function (td) {
      if ((t.Trade.code === td.trade.code) && (t.Direction.code === td.direction.code)) {
        $scope.filter.cluster.forEach(function(c) {
          if (t.Cluster.code === c.code) {
            return true;
          }
        });
      }
    });
  }
  else {
    return false;
  }
}

令人惊讶的是,当我调试时,我可以看到控件一直运行到每个匹配记录的return语句。尽管如此,数据仍未过滤。我很疑惑为什么?

以下是md-choices的html代码:

<div class="filter layout layout-sm-column task_top_filters">
  <md-input-container ng-class="{'md-input-has-value': filter.tradeDir}" 
                      class="flex-sm-100 md_container_fr_task">
    <label>Trade/Direction</label>
    <md-select multiple ng-model="filter.tradeDir" 
                        md-on-close="closeTradeFilter(filter.tradeDir)"
                        ng-model-options="{trackBy: '$value.name'}">
      <md-option ng-value="t" ng-repeat="t in tradeDirArray track by $index">
        {{t.name}}
      </md-option>
    </md-select>
  </md-input-container>
  <md-input-container  ng-disabled="filter.tradeDir.length === 0"
                       ng-class="{'md-input-has-value': filter.cluster}"
                       class="flex-sm-100 md_container_fr_task">
    <label>Cluster</label>
    <md-select multiple ng-model="filter.cluster" 
                        ng-model-options="{trackBy: '$value.code'}">
      <md-option ng-value="t" ng-repeat="t in filterClusters track by $index">
        {{t.code}}
      </md-option>
    </md-select>
  </md-input-container>
</div>

以下是我如何称呼它:

<li ng-repeat="t in dataList| filter: filterTasks track by t.id" class="li_row">

过滤器有问题吗?任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

嗯,上面代码的问题是我为forEach函数返回true,而后者应该从原来的filterTasks函数返回。 下面的代码工作正常:

$scope.filterTasks = function (t, i, array) {
                if ($scope.filter.tradeDir.length === 0 && $scope.filter.cluster.length === 0) {
                    return true;
                } else if ($scope.filter.tradeDir.length !== 0 && $scope.filter.cluster.length === 0) {
                    $scope.filter.tradeDir.forEach(function (td) {
                        if ((t.Trade.code === td.trade.code) && (t.Direction.code === td.direction.code)) {
                            x = true;
                        }
                    });
                    return x;
                } else if ($scope.filter.cluster.length !== 0 && $scope.filter.tradeDir.length !== 0) {
                    $scope.filter.tradeDir.forEach(function (td) {
                        if ((t.Trade.code === td.trade.code) && (t.Direction.code === td.direction.code)) {
                            $scope.filter.cluster.forEach(function (c) {
                                if (t.Cluster.code === c.code) {
                                    x = true;
                                }
                            });
                            return x;
                        }
                    });
                    return x;
                } else {
                    return false;
                }
            }