Question

我有一个对象数组：

[{
  name: "test",
  type: 0,
  speed: 50
}, {
  name: "test2",
  type: 4,
  speed: 10
}, {
  name: "test3",
  type: 4,
  speed: 67
}, {
  name: "test4",
  type: 2,
  speed: 40
}]

我想用ng-repeat显示数组..
直到这里一切都很简单......

但现在我想添加几个按钮，每个按钮都会用其他参数过滤数组...
例如：

按钮一：仅显示速度大于X的对象，
按钮2：仅显示类型为Y的对象。
等...

我现在如何使用角度过滤器，但我无法理解如何使用它来满足我的需求......

非常感谢！

Answer 1

最适合您的解决方案是使用名为filter的过滤器。它可以在参数中接受自定义过滤功能。

<强> HTML

<div ng-repeat="item in items|filter:filterItem"></div>

然后你应该在控制器中定义函数filterItem：

<强> JS

// assume that first button sets `$scope.hideSlow` flag and the second `$scope.showType` respectively
$scope.filterItem = function(item) {
    return (!$scope.hideSlow || item.speed > X) &&
       (!$scope.showType || item.type === Y);
}

您可以在此函数中添加额外的过滤逻辑，但不要忘记对其进行写入测试，以确保您的函数正确过滤

Answer 2

我可能会建议创建一个自定义过滤器，检查模型以确定过滤器的结果集。将按钮绑定到示波器上的方法以在过滤器内进行检查。

https://docs.angularjs.org/tutorial/step_09

角度 - 实时应用过滤器

2 个答案: