Question

我有以下情况：指标列表，每个指标都具有属性名称，描述，基本和差异。

$scope.indicators = [
  { name: 'indicator1' , description: 'blah1', essential: true, differential: false },
  { name: 'indicator2' , description: 'blah2', essential: false, differential: true },
  { name: 'indicator3' , description: 'blah3', essential: true, differential: true },
  { name: 'indicator4' , description: 'blah4', essential: false, differential: false }    
]

我希望能够通过选择以下组合进行过滤： “全部”，“必要”，“差异”，“基本和差异”，“既不必要也不差异”

我尝试在与 ng-repeat 关联的选项中使用 ng-model |过滤，但这破坏了分页。

我想不出使用 st-search 指令的方法，因为我正在过滤两个属性。

有人有建议吗？

使用示例代码跟随plunker：http://plnkr.co/edit/t9kwNUjyJ15CbLFFbnHb

谢谢！

Answer 1

搜索是累积的，因此如果您使用多个调用控制器api search，则可以添加谓词。

只要确保在值发生变化时重置sortPredicate对象。

this plunker展示了如何根据您的要求编写插件（虽然我不明白all在此上下文中的含义

.directive('customSearch',function(){
return {
  restrict:'E',
  require:'^stTable',
  templateUrl:'template.html',
  scope:true,
  link:function(scope, element, attr, ctrl){
     var tableState=ctrl.tableState();
     scope.$watch('filterValue',function(value){
       if(value){
         //reset
         tableState.search.predicateObject ={};

         if(value==='essential'){
           ctrl.search('true', 'essential');
         } else if(value === 'differential'){
           ctrl.search('true', 'differential')
         } else if(value === 'both'){
           ctrl.search('true','essential');
           ctrl.search('true', 'differential');
         } else if(value === 'neither'){
            ctrl.search('false','essential');
            ctrl.search('false', 'differential');
         }
       }
     })
  }
};});

Answer 2

我就是这样做的。

在你的控制器中定义一个带有可能选项的数组和每个选项的过滤器，如下所示：

     $scope.options = [
        {value:'All', filter:{}},
        {value:'Essential', filter:{essential:true}},
        {value:'Differential', filter:{differential:true}},
        {value:'Essential and Differential', filter:{differential:true, essential:true}},
        {value:'Neither Essential nor Differential', filter:{differential:false, essential:false}}
     ];

然后在你的html中使用这个数组声明你的选择，如下所示：

        <select ng-model='diffEssFilter' ng-options='option.value for option in options'>
        </select>

然后在ng-repeat中使用将存储在diffEssFilter中的过滤器，如下所示：

<tr ng-repeat="indicator in indicators | filter:diffEssFilter.filter">

那就是它。

在angular js smart-table中按多个布尔属性进行过滤

2 个答案:

Working example