如何计算ng-hide AngularJS下显示的元素

时间:2013-07-30 05:42:15

标签: javascript angularjs

目前,我的应用程序包含两个过滤功能:一个用于显示与指定过滤器匹配的列表项,另一个用于跟踪当前显示的列表项数。我会使用普通的过滤器,但我的应用程序需要能够删除过滤视图中的单个列表项。普通过滤器不提供此功能。以下是我的第一个过滤器的更多信息: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注入我的自定义过滤器?有没有更好的方法来执行这两项任务?感谢您的帮助。

0 个答案:

没有答案