我有一个像这样的数组数据:
[
{
firstName: "John",
lastName: "Adams",
calls: [
{
date: "2014-08-13",
number: 123456789,
operatorName: "Bla-Bla 1"
},
{
date: "2014-08-18",
number: 987654321,
operatorName: "Bla-Bla 2"
},
{
date: "2014-11-06",
number: 123456543,
operatorName: "Bla-Bla 1"
},
{
date: "2014-10-15",
number: 987654567,
operatorName: "Bla-Bla 3"
}
]
},
{
firstName: "Jonnie",
lastName: "Bravo",
calls: [
{
date: "2014-05-09",
number: 534535367,
operatorName: "Bla-Bla 1"
},
{
date: "2014-01-25",
number: 089086464,
operatorName: "Bla-Bla 1"
}
]
},
{
firstName: "Ricky",
lastName: "Lambert",
calls: [
{
date: "2014-10-19",
number: 147258369,
operatorName: "Bla-Bla 3"
},
{
date: "2014-11-01",
number: 798908645,
operatorName: "Bla-Bla 2"
},
{
date: "2014-11-05",
number: 312315367,
operatorName: "Bla-Bla 3"
}
]
}
]
我正在使用 Angular 来循环访问所有客户,如下所示:
<div ng-repeat="customer in customers">
<span ng-repeat="call in customer.calls">
<span class="name">{{ customer.name }}</span>
<span class="info">{{ call.date }} - {{ call.number }} - {{ call.operatorName }}</span>
</span>
</div>
输出是这样的:
John Adams
2014-08-13 - 123456789 - Bla-Bla 1
John Adams
2014-08-18 - 987654321 - Bla-Bla 2
...
Jonnie Bravo
2014-05-09 - 534535367 - Bla-Bla 1
...
Ricky Lambert
2014-11-05 - 312315367 - Bla-Bla 3
我现在遇到的问题是我想过滤数据以显示所有调用运算符(operator) Bla-Bla 1
的用户。我搜索了嵌套的 ng-repeats 但没有任何帮助。请记住,我希望我的数据像这样显示。
希望你能理解我。有任何想法吗? :)
最佳答案
添加
ng-if="call.operatorName=='Blabla 1'"
到第二个ngRepeat
您还可以使用过滤器过滤数据:
ng-repeat="call in customer.calls | filter:{operatorName:'Bla-Bla 1'}"
或者一些自定义:
ng-repeat="call in customer.calls | operatorF:'Bla-Bla 1'"
$scope.operatorF = function(){
return function(calls, op) {
if (!op) return calls;
return calls.filter(function(call){
return call.operatorName === op
});
};
}
或者更好:
ng-repeat="call in customer.calls | filter:operator:'Bla-Bla 1'"
$scope.operator = function(call, op){
if (!op) return true;
return call.operatorName === op
};
如果没有循环,你就无法做到这一点。
您还可以手动检查更改并更新过滤集:
ng-repeat="call in customer.filteredCalls"
$scope.$watch('customer.calls', function(){
$scope.customer.filteredCalls = $scope.customer.calls.filter(myFilterFn);
});
关于javascript - 两个嵌套 ng-repeat 上的 Angular 自定义过滤,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27110613/