如何将过滤后的对象属性聚合成ng-重复角
我使用了角1.2.16并过滤了如下所示的对象列表：
<li ng-repeat="item in filteredItems = (items | filter:query)">
{{item.title}}
</li>假设下面有"items“数组
var items = [ { title: "foo", priority: 1 },
{ title: "bar", priority: 2 },
{ title: "bla", priority: 1 } ];在用"b“过滤后，角集"filteredItems”设置为
filteredItems == [ { title: "bar", priority: 2 },
{ title: "bla", priority: 1 } ];我想要做的是计数每种优先级类型的出现情况，后过滤器，并打印出来。例如，给定上述场景的输出将打印priority-1 = 2, priority-2 = 1，然后在应用过滤器"b“后成为priority-1 = 1, priority-2 = 1。
我该怎么做呢？
我尝试创建一个新的控制器，然后使用$scope.$parent.filteredItems，但是filteredItems部分不会动态更新。
这是一个plunkr http://plnkr.co/edit/uA5TgBVFVEd89dHSP0Yo
回答 2
Stack Overflow用户
发布于 2014-09-22 19:35:37
本·纳德尔的这篇文章最接近于回答我的问题，它添加了一个自定义指令，在ng-重复完成后触发一个事件。然而，这比我想要的要复杂一些。
我的最后一种方法是向控制器中添加一个自定义$filter，当输入发生变化时会触发它，并最终创建一个可以打印出来的摘要对象。柱塞可以找到这里。
HTML：
<input ng-model="query" type="text" ng-change="myFilter(query)" />
<ul>
<li ng-repeat="item in items">
<pre>{{item}}</pre></li>
</ul>
<h3>Summary of items</h3>
<p >
Priority-1: {{summary.p1}}<br>
Priority-2: {{summary.p2}}
</p>
</body>The App.js
var app = angular.module('app', []);
app.controller('ParentCtrl', ['$scope', '$filter',
function($scope, $filter) {
$scope.originalItems = [{
title: "foo",
priority: 1
}, {
title: "bar",
priority: 2
}, {
title: "bla",
priority: 1
}];
$scope.items = $scope.originalItems;
var summarize = function(items) {
var summary = {
p1: 0,
p2: 0
};
for (var i in items) {
switch (items[i].priority) {
case 1:
summary.p1++;
break;
case 2:
summary.p2++;
break;
}
}
return summary;
};
$scope.myFilter = function(query) {
$scope.items = $filter('myFilter')($scope.originalItems, query);
$scope.summary = summarize($scope.items);
}
$scope.summary = summarize($scope.items);
}
]);
app.filter('myFilter', ['$filter',
function($filter) {
return function(items, query) {
return $filter('filter')(items, query);
};
}
]);Stack Overflow用户
发布于 2014-12-23 06:15:45
更简单的方法，但仍然不理想：
http://plnkr.co/edit/wkGKYQus2exkLycIu9XB?p=preview
html：
<body ng-controller="ParentCtrl">
<input ng-model="query" type="text"/>
<ul>
<li ng-repeat="item in items | filter : query">
<pre>{{item}}</pre></li>
</ul>
<h3>Summary of items</h3>
<p >
Priority-1: {{items | filter : query | sumFilter: '1'}}<br>
Priority-2: {{items | filter : query | sumFilter: '2'}}
</p>
</body>联署材料：
app.filter('sumFilter', function() {
return function(items, value) {
var summary = 0;
for (var i in items) {
if (items[i].priority == value) {
summary++;
}
}
return summary;
}
});https://stackoverflow.com/questions/25979360
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号