两列的AngularJS自定义过滤器答案

【问题标题】：AngularJS custom filter for two columns两列的AngularJS自定义过滤器
【发布时间】：2017-08-15 22:58:43
【问题描述】：

我有一个带有 option1 和 option2 的选择框；我有一个包含 column1、column2、column3、column4 的表。 Column2 和 column3 是数字字段。

1) 我希望我在选择框中选择 option1，该表显示 column2 中所有 fileld 均 >0 且 column3 的所有字段 == 0 的行

2) 我希望我在选择框中选择了 option2，表格显示 column2 中的所有 fileld 为 ==0 且 column3 的所有字段 > 0 的行

例子

select class="form-control" name="optionsSelect" ng-model="ctrl.table.filterParams.optionSelect" 
        ng-options="option for option in ctrl.ctx.option">
</select>

<div class="bt-table">
    <table class="table table-striped" ng-table="ctrl.tableParams" id="exampleTable">
      <thead>
        <tr>
          <th ng-repeat="item in items"><p ng-bind-html="item"></th>
        </tr>
      </thead>
      <tbody>
        <tr ng-repeat="item in ctrl.table.data">
          <td><a>{{item.column1}}</a></td>
          <td>{{item.column2}}</td>
          <td>{{item.column3}}</td>
          <td>{{item.column4}}</td>
           <td>{{item.column5| date: 'dd/MM/yyyy'}}</td>
          <td>{{item.column6| currency : "" | currencyformat }}</td>
         </span></td>

          <td>{{item.column7}}</td>
          <td>                
            {{item.column8}}
          </td>
        </tr>
      </tbody>
    </table>

感谢您的帮助

【问题讨论】：

你能用你的控制器代码发布一个工作的 jsfiddle 吗？

标签： angularjs json angularjs-directive angularjs-scope

【解决方案1】：

使用角度“过滤器”过滤器。

把它放到你的控制器中

ctrl.filterCriteria = function (item) {
    if (ctrl.table.filterParams.optionSelect == option1) {
        return item.column2 > 0 && item.column3 == 0;
    } else if (ctrl.table.filterParams.optionSelect == option2) {
        return item.column2 == 0 && item.column3 > 0
    } else {
        // Display all items
        return true;
    }
};

在模板中更改：

<tr ng-repeat="item in ctrl.table.data | filter:ctrl.filterCriteria">

这样的东西应该可以工作，我无法测试它，因为我没有测试数据。如果您对此有任何问题，请添加一个 jsfiddle，我会看看它。

【讨论】：