簡體   English   中英

ng-repeat 表中的 AngularJS 自定義過濾器

[英]AngularJS Custom Filter in ng-repeat Table

我可以使用此自定義過濾器過濾表(特定列)中的值。 數據來自多選輸入的數組

完整示例: http : //jsfiddle.net/d1sLj05t/1/

myApp.filter('filterMultiple',['$filter',function ($filter) {
    return function (items, keyObj) {
        var filterObj = {
            data:items,
            filteredData:[],
            applyFilter : function(obj,key){
                var fData = [];
                if(this.filteredData.length == 0)
                    this.filteredData = this.data;
                if(obj){
                    var fObj = {};
                    if(angular.isString(obj)){
                        fObj[key] = obj;
                        fData = fData.concat($filter('filter')(this.filteredData,fObj));
                    }else if(angular.isArray(obj)){
                        if(obj.length > 0){ 
                            for(var i=0;i<obj.length;i++){
                                if(angular.isString(obj[i])){
                                    fObj[key] = obj[i];
                                    fData = fData.concat($filter('filter')(this.filteredData,fObj));    
                                }
                            }           
                        }                                       
                    }                                   
                    if(fData.length > 0){
                        this.filteredData = fData;
                    }
                }
            }
        };

        if(keyObj){
            angular.forEach(keyObj,function(obj,key){
                filterObj.applyFilter(obj,key);
            });         
        }               
        return filterObj.filteredData;
    } 
}]);
<tr ng-repeat="emp in empList | filterMultiple:{dept:selected}">    

當值存在如“sales”或“account”時完美,但當表中不存在該值時,返回所有數據(當我選擇“not”或組合“not”和“sales”時)。 我期望一個空結果 o 只是選定的值

我認為你可以用一個更簡單的過濾器來完成你想要的。 你可能想嘗試這樣的事情:

myApp.filter('filterMultiple',['$filter',function ($filter) {
    return function (items, keyObj) {
        //If the value isn't defined, don't filter at all.
        if (keyObj.value == undefined) {
            return items;
        }
        //Use javascript's native Array.filter() to get only the items that match.
        return items.filter(function(item) {
            //Keep any items whose specified attribute includes the selected value
            return item[keyObj.column].includes(keyObj.value);
        })
    }
}]);

你的 HTML 略有變化:

<tr ng-repeat="emp in empList | filterMultiple:{column:'dept', value:selected}"> 

我不確定你所說的“結合‘非’和‘銷售’”是什么意思,但我認為這會讓你朝着正確的方向前進。

以下是一些相關鏈接,以防您不熟悉我在代碼中所做的一些事情:

Array.filter 的文檔 -- MDN

Array.filter 優於 $filter('filter') -- StackOverflow

String.includes 的文檔——MDN

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM