Angular:计算与条件匹配的项目

Question

我有这一系列的项目

[
  {
    name: 'Foo',
    completed: false
  },
  {
    name: 'Ninja',
    completed: true
  },
  {
    name: 'Hello',
    completed: true
  },
  {
    name: 'Baby',
    completed: false
  },
]

我想在我的视图中显示完成=真的计数.当元素从completed = false变为true时,我还需要此计数器自动更新.有没有办法以棱角分明的方式做到这一点？

Answer 1

您应该查看过滤器并使用它来动态过滤您的阵列; 在您的控制器中声明您的过滤器

$scope.completedFilter(object) {
    return object.completed === true;
}

在模板中,您可以添加

{{(myArray | filter:completedFilter).length}}

并且您的计数将随着完成而自动更改

注意:如果要在另一个控制器中重用它,也可以在模块中声明一个适当的过滤器