Question

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

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

人员列表，其复选框基于active字段进行检查。
消息列表，仅显示具有active : true。
有关从第二个表汇总的邮件的统计信息列表，显示每个类别中的邮件数，但应仅为具有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字段。我怎样才能将它传播到其他表？

到目前为止我尝试过的是在messages数组中为每个对象添加一个状态，根据person数组的状态显示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。最后一个统计部分留给读者练习：）

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

1 个答案: