AngularJS 过滤最佳实践
AngularJS Filter Best Practice
我有一个过滤器需要使用两次(两次 pages/controllers),过滤一个对象类别。我可以在每个控制器中使用它:
$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);
}
});
您可以看到我也在尝试获取该类别选项。我如何进入范围并获得类别?我是否应该使用一项服务并点击其中一个按钮来设置要过滤的类别?
我仍在学习过滤器以及想要确保其可重复使用并遵循最佳实践的内容
将对象传递给过滤器表达式:filter:{category: '...', compareTo: '...'}
并在过滤器函数中检查它。
我有一个过滤器需要使用两次(两次 pages/controllers),过滤一个对象类别。我可以在每个控制器中使用它:
$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);
}
});
您可以看到我也在尝试获取该类别选项。我如何进入范围并获得类别?我是否应该使用一项服务并点击其中一个按钮来设置要过滤的类别?
我仍在学习过滤器以及想要确保其可重复使用并遵循最佳实践的内容
将对象传递给过滤器表达式:filter:{category: '...', compareTo: '...'}
并在过滤器函数中检查它。