Question

我有一个过滤器，我需要使用两次（两个页面/控制器），过滤一个对象类别。我可以在每个控制器中使用它来实现此功能：

     $scope.$on('category', function (event, arg) {
                $scope.catSort = arg;
            });    

     $scope.filterCat = function (item) {
                return !$scope.catSort ?
                    item : (item.category == $scope.catSort);
            };

我正在过滤的HTML：

 <li dnd-draggable="item" ng-repeat="item in items| filter: filterCat">
        </li>

我设置$ scope.catSort，这是在用户可以点击的按钮列表中过滤的内容：

<button class="btn btn-default" ng-click="$emit('category', 'all')">Show All</button>
<button class="btn btn-default" ng-click="$emit('category', 'Common')">Common</button>

问题是，我有另一个html页面，其中包含我需要过滤的不同类别子集。我不想再复制和粘贴$ scope.filterCat函数再次过滤，而是想创建一个单独的过滤器来注入每个控制器（这就是最佳实践吗？）。

所以我开始的是一个单独的过滤器：

angular.module("category-filter", [])
    .filter('filterCat', function () {
        return function (category, item) {
            return !category ?
                product : (item.category == $scope.catSort);
        }
    });

你可以看到我也试图获得该类别选项。我如何进入范围并获得类别？我是否应该使用服务并在其中一个按钮点击上设置要过滤的类别？

我仍然在学习过滤器以及想要确保其可重用并遵循最佳实践的内容

Answer 1

将对象传递给过滤器表达式：filter:{category: '...', compareTo: '...'}并在过滤器函数内检查它。

AngularJS过滤器最佳实践

1 个答案: