Angular - 智能表 - 或在过滤器中答案

【问题标题】：Angular - Smart-table - OR in filterAngular - 智能表 - 或在过滤器中
【发布时间】：2015-03-05 13:02:18
【问题描述】：

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

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

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方法。

谁能提供一两个建议？非常感谢。

【问题讨论】：

标签： angularjs angularjs-directive smart-table

【解决方案1】：

对于默认角度过滤器过滤器不支持的 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>

【讨论】：

嗨 Laurent，非常感谢您的回复。我会在接下来的一两天内试一试，并带回相关的感谢！

【解决方案2】：

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 
}})

【讨论】：