Angular：ng-repeat 取决于其他对象的状态

Question

我无法根据不同数组中对象的状态来确定如何使用 ng-repeat。

想象一下我的页面显示 3 个表格，使用 ng-repeat 填充：

1. 人员列表，带有基于active 字段选中的复选框。
2. 消息列表，仅显示拥有active : true 的人的消息。
3. 从第二个表中汇总的消息统计信息列表，显示每个类别中的消息数量，但应仅计算具有active : true 状态的用户的消息。

一个例子如下所示。第一个表显示所有用户，未选中“anna”复选框。带有消息的第二个表不显示“anna”的消息。第三个表格显示了每个类别中的消息数量，用于发送给除 anna 之外的任何人的消息。

$scope.person = [ 
    { id : 1, name : "john", active : true},
    { id : 2, name : "bob", active: true},
    { id : 3, name : "anna", active: false}
]

$scope.messages = [
    { personid: 1, message: "hello", category: "greeting"},
    { personid: 1, message: "hi", category: "greeting"},
    { personid: 2, message: "hello", category: "greeting"},
    { personid: 2, message: "no", category: "denial"},
    { personid: 2, message: "yes", category: "confirmation"},
    { personid: 3, message: "yes", category: "confirmation"}
]

$scope.messagestatistics = [
    { category : "greeting", count : 3},
    { category : "denial", count: 1},
    { category : "confirmation", count: 1}
]

上面显示的 messagestatistics 数组是在仅考虑人员 'john' 和 'anna' 的情况下生成的。

我已经能够使用 ng-repeat 创建第一个表，并根据用户单击的复选框更新 active 字段。如何将其传播到其他表？

到目前为止，我尝试为消息数组中的每个对象添加一个状态，即 active : true/false 基于人员数组的状态。然后，每次用户单击第一个表中的复选框时，我都会更新此状态，并重新生成 messagestatistics 表。但是，我会在 state 字段中保留重复的数据，并希望有一种更有角度的方式来做到这一点？如果我有 10 000 条消息，我还担心这可能不是一个好方法？

Answer 1

所以您的问题主要是如何根据一些外部输入重复过滤值？一种方法就是这样做，filter！ Angular 中的标准过滤器采用一个数组并仅过滤掉那些匹配比较器函数的条目。你会做这样的事情：

<div ng-repeat="message in messages | filter:isActive">
  <span>{{message.message}}</span>
</div>

在这种情况下，isActive 是您在控制器中定义的任意方法，它接受一个对象（消息）并根据是否显示它返回 true 或 false。需要注意的一点是，过滤器对数组中的每个项目运行一次，并且可以在每个摘要周期中触发多次，因此请保持轻量级。

例如，不要开始循环数组来检查过滤器内的活动标志。编译一个在过滤器之外的活跃用户列表，然后在过滤器内编译一个简单的检查列表。

Here is a fiddle with a simple example。最后的统计部分留给读者练习:)