1

目前,我的应用程序包含两个过滤器功能:一个显示与指定过滤器匹配的列表项,另一个跟踪当前显示的列表项的数量。我会使用普通过滤器,但我的应用需要能够删除过滤视图中的单个列表项。普通过滤器不提供此功能。这是我的第一个过滤器的更多信息:http ://www.bennadel.com/blog/2487-Filter-vs-ngHide-With-ngRepeat-In-AngularJS.htm?&_=0.17772154766134918#comments_42833

这是我的两个功能:

JS:

myAppModule.controller('TweetCtrl',function($scope, $rootScope, $filter){


$scope.isExcludedByFilter = applySearchFilter(); //displays all tweets when data is retrieved
$rootScope.filteredData = $scope.tweets.length; //sets the number of displayed tweets to the number of total tweets

$scope.$watch(
    "filters.search",
    function( newText, oldText ) {
        if ( newText === oldText ) {
            return;
        }


       $rootScope.filteredData = $filter('mainFilter')($scope.tweets, $scope.filters.search, $scope.filters.polarity); //sets the number of filtered tweets being shown based on a search query

        applySearchFilter(); //displays a list of tweets that match the search query


    }
);

$scope.$watch(
    "filters.polarity",
    function( newCat, oldCat ) {
        //console.log(newCat);
        if ( newCat === oldCat ) {

            return;

        }
        $rootScope.filteredData = $filter('mainFilter')($scope.tweets, $scope.filters.search, $scope.filters.polarity); //sets the number of filtered tweets being shown based on an object property
        applySearchFilter(); //displays a list of tweets that match the object property
    }
);

// ---
// PRIVATE METHODS.
// ---


function applySearchFilter() {
    var polarityFilter = $scope.filters.polarity.toLocaleLowerCase();
    var polarity = $scope.tweet.polarity.toLowerCase();
    //console.log("filter: " + polFilter + "/pol: " + polarity);
    var searchFilter = $scope.filters.search.toLowerCase();
    var text = $scope.tweet.text.toLowerCase();
    //console.log(text);

    //console.log("textFilter: " + textFilter + "/text: " + text);


        if( searchFilter =="" && polarityFilter == ""){
            $scope.isExcludedByFilter = false;
            //console.log($scope.isExcludedByFilter + "none");
        } else if(searchFilter == "" && polarityFilter !== ""){
            var isCategory = (polarityFilter == polarity);
            $scope.isExcludedByFilter =  ! isCategory;

        } else if(searchFilter !=="" && polarityFilter == ""){
            var isSubstring = ( text.indexOf( searchFilter ) !== -1 );
            $scope.isExcludedByFilter = ! isSubstring;

        } else if(searchFilter !=="" && polarityFilter !==""){
            var isCategory = (polarityFilter == polarity);
            var isSubstring = ( text.indexOf( searchFilter ) !== -1 );

            $scope.isExcludedByFilter = ! isSubstring || ! isCategory;

        }

}


});

myAppModule.filter('mainFilter', function($scope){
return function (tweets, textFilter, polFilter) {
    var counter = 0;
   var length = tweets.length;


    for (var i = 0; i < length; i++) {
        var tweetText = tweets[i]['text'].toLowerCase();
        var polarity = tweets[i]['polarity'].toLowerCase();
        var isSubstring = (tweetText.indexOf(textFilter.toLowerCase()) !== -1);
        var isCategory = (polarity == polFilter.toLowerCase());
        if(textFilter == "" && polFilter == ""){
            counter++;

        } else if(textFilter !== "" && polFilter == ""){

                if (isSubstring) {
                counter++;
                }
        } else if(textFilter =="" && polFilter !== ""){

                if (isCategory){
                    counter++;
                }
        } else if(textFilter !=="" && polFilter !==""){
                if (isSubstring && isCategory ){
                    counter++;
                }
        }
    }
    return counter.toString();
}
});

虽然这种方法运行良好,没有任何明显的滞后,但调用两个类似的函数似乎效率很低。我想将“applySearchFilter()”函数的功能与我的自定义过滤器结合起来。这将允许我显示正确的列表项并通过调用一个函数来计数。我尝试了以下方法:

myAppModule.filter('mainFilter', function($scope){
return function (tweets, textFilter, polFilter) {
    var counter = 0;
   var length = tweets.length;


    for (var i = 0; i < length; i++) {
        var tweetText = tweets[i]['text'].toLowerCase();
        var polarity = tweets[i]['polarity'].toLowerCase();
        var isSubstring = (tweetText.indexOf(textFilter.toLowerCase()) !== -1);
        var isCategory = (polarity == polFilter.toLowerCase());
        if(textFilter == "" && polFilter == ""){
            counter++;
            $scope.isExcludedByFilter = false;
        } else if(textFilter !== "" && polFilter == ""){

                if (isSubstring) {
                counter++;
                $scope.isExcludedByFilter = ! isSubstring;
                }
        } else if(textFilter =="" && polFilter !== ""){

                if (isCategory){
                    counter++;
                    $scope.isExcludedByFilter = ! isCategory;
                }
        } else if(textFilter !=="" && polFilter !==""){
                if (isSubstring && isCategory ){
                    counter++;
                    $scope.isExcludedByFilter = ! isSubstring || ! isCategory ;
                }
        }
    }
    return counter.toString();
}
});

但收到此错误:

Error: Unknown provider: $scopeProvider <- $scope <- mainFilterFilter

除了这个错误:

Error: Circular dependency: which refers to the first line in my "TweetCtrl" controller.

我的问题是,如何正确地将 $scope 注入到我的自定义过滤器中?有没有更好的方法来执行这两项任务?我感谢您的帮助。

4

0 回答 0