1

我正在使用非常好的智能表库来显示我的数据。我制作了一个自定义过滤器指令,允许我为按钮分配过滤器,以便用户可以轻松地按行状态(即“新建”、“完成”、“失败”等)进行过滤。这很好用,但我希望能够复合过滤器,以便我可以按包含状态列中两个值之一的行进行过滤(例如“新”和“失败”)。

我的自定义过滤器看起来像....

app.directive('stCustomFilter', function() {
    return {
        restrict: 'A',
        require: '^stTable',
        scope: true,
        link: function(scope, element, attr, ctrl) {
            var tableState = ctrl.tableState();
            var searchText = attr.stCustomFilter;
            var searchColumn = attr.stCustomFilterColumn;

            element.on('click', function(data) {
                tableState.search.predicateObject = {};
                ctrl.search(searchText, searchColumn);
                //console.log(tableState);
                scope.$apply();
            })
        }
    };
});

并在st-table的thead中按如下方式使用......

<div class="btn-group  btn-group-sm">
    <button st-custom-filter="" st-custom-filter-column="status">All</button>
    <button st-custom-filter="New" st-custom-filter-column="status">New</button>
    <button st-custom-filter="Done" st-custom-filter-column="status">Done</button>
    <button st-custom-filter="Failed" st-custom-filter-column="status">Failed</button>
</div> 

所以理想情况下,我希望能够通过稍微改变指令在 st-custom-filter 中使用类似“New||Failed”的东西,但我觉得答案可能在于写一些更复杂的东西,涉及st-pipe 方法。

任何人都可以提供一两个建议吗?非常感谢。

4

2 回答 2

0

对于默认角度过滤器过滤器不支持的 OR 过滤器,您必须设置自定义过滤器并告诉 smart-table 使用此过滤器代替默认过滤器

angular.filter('myCustomFilter',function(){
return function(array, predicteObject){
//the predicate object is forwarded by smart table whenever a directive call the search method.. for example :{ myProp1:'myInput1',myProp2:'myInput2
//process the array with your OR logic
}})

然后告诉智能表使用您的自定义过滤器代替默认过滤器

<table st-table="myCollection" st-set-filter="myCustomFilter"></table>
于 2015-03-16T14:37:48.247 回答
0
scope.displayClients  = [].concat(scope.clients);
scope.predicates = ['col1', 'col2', 'col3'];
scope.selectedPredicate = scope.predicates[0];

app.filter('myStrictFilter', function($filter){
 return function(input, predicate){
    return $filter('filter')(input, predicate, false);  //false -if contains     string, true if matches string
}})




scope.displayClients  = [].concat(scope.clients);
scope.predicates = ['col1', 'col2', 'col3'];
scope.selectedPredicate = scope.predicates[0];

app.filter('myStrictFilter', function($filter){
    return function(input, predicate){
        return $filter('filter')(input, predicate, false); // true for exact match 
}})
于 2017-01-27T22:26:13.093 回答